<script setup lang="ts">
import dayjs from 'dayjs'
import { onUnmounted, ref, watch, nextTick, computed, defineProps } from 'vue'
import { judgeIosPermission } from './permission.js' //此处根据个人存放位置更改
import { useMemberStore, useSystemStore } from '@/stores'
import { msgTimeFormat } from './utils.js'
import {
  followCreate,
  getChatMsgList,
  sendChatMsg,
  getCollectList,
  getCartList,
  getHistoryList,
  getWeight,
  getDiet,
  getChatIsOk,
  getMotion,
  getSleep,
  messageIsRead,
} from '@/api/popular'
import { getPatienDetails, getAntenatalData, getBabyDetails } from '@/api/patients/index'
import { onShow, onLoad, onReady, onHide, onPageScroll } from '@dcloudio/uni-app'
import { chatIm } from '@/utils/chat'
import trumpet from '@/uni_modules/a-trumpet/components/a-trumpet/a-trumpet.vue'
import TencentCloudChat from '@tencentcloud/chat/index.es.js'
import articlePopup from './chat-components/article-popup.vue'
import yundata from './chat-components/yundata.vue'
import mandata from './chat-components/mandata.vue'
import childdata from './chat-components/childdata.vue'
import hn from './chat-components/head-nav.vue'
import {
  getdoctorChatlist,
  getPrenatalExamination,
  getUserCardDetail,
  getDoctorInfo,
} from '@/api/pregnancy'
import { commonToolsMessageConfigList } from '@/api/suggest'
import { navigateTo } from '@/utils'
const iptVal = ref()
const showImg = ref(false)
const store = useMemberStore()
const doctor_info = ref()
const myAvatar = ref('')
const messageList = ref([])
const nextReqMessageID = ref('')
const isCompleted = ref(true)
const isFocus = ref(false)
const color = ref('#a28aff')
const background = ref('#EDE7FF')
const gradualchange = ref('v-bind(gradualchange)')
const buttonColor = ref('v-bind(buttonColor)')
const system = ref()
const moreList = ref([
  { img: '/static/yunchan/chat/comreply.png', title: '常用回复', type: 11 },
  { img: '/static/yunchan/chat/pic.png', title: '相册', type: 1 },
  { img: '/static/yunchan/chat/clickpic.png', title: '拍摄', type: 2 },
  // { img: '/static/yunchan/chat/card.png', title: '个人名片', type: 3 },
  // { img: '/static/yunchan/chat/reduec.png', title: '产检记录', type: 4 },
  // { img: '/static/yunchan/chat/clock.png', title: '体重记录', type: 5 },
  // { img: '/static/yunchan/chat/food.png', title: '饮食记录', type: 6 },
  // { img: '/static/yunchan/chat/sport.png', title: '运动记录', type: 7 },
  { img: '/static/yunchan/chat/comsug.png', title: '常用建议', type: 12 },
  { img: '/static/yunchan/chat/goods.png', title: '商品/服务', type: 8 },
  // { img: '/static/yunchan/chat/sleep.png', title: '睡眠记录', type: 9 },
  { img: '/static/yunchan/chat/article.png', title: '文章/视频', type: 10 },
])
const showMoreList = ref([])
/**
 * 功能列表
 */
const getIndexToolsDataFn = async () => {
  const chunkSize = 8
  // console.log(data)
  for (let i = 0; i < moreList.value?.length; i += chunkSize) {
    const chunk = moreList.value.slice(i, i + chunkSize)
    showMoreList.value.push(chunk)
  }
}
function record() {
  console.log(judgeIosPermission('record'))
  if (judgeIosPermission('record')) {
    audioShow.value = !audioShow.value
    recordAuth.value = true
  } else {
    uni.showToast({
      title: '您拒绝了录音授权，请在应用设置中手动打开',
      icon: 'none',
    })
  }
  if (audioShow.value && recordAuth.value) {
    isFocus.value = false
  } else {
    isFocus.value = true
  }
  nextTick(() => {
    height()
  })
}
const temporarilyList = ref([])
const setMsgList = ref({})

// 判断用户是否可以继续聊天
const isChat_is_ok = ref(0)
const children_user_id = ref()
onLoad((o) => {
  if (o?.childId) {
    children_user_id.value = o?.childId
  }
  messageList.value = []
  finished.value = false
  paramsMsg.value.page = 1
  messagetoalt.value = 0
  doctor_info.value = useMemberStore()
  system.value = useSystemStore()
  if (o?.childId) {
    getbabydetail({ uid: o?.uid, child_id: o?.childId })
    emitfunc()
  }
  if (o.chat_type == 1) {
    color.value = '#54CEAB'
    background.value = '#EDE7FF'
    gradualchange.value = '#fff'
    buttonColor.value = '#54CEAB'
  } else if (o.chat_type == 2) {
    color.value = '#54CEAB'
    background.value = '#fff'
    gradualchange.value = '#A7E4D4'
    buttonColor.value = '#54CEAB'
  } else {
    color.value = '#54CEAB'
    background.value = '#fff'
    gradualchange.value = '#A7E4D4'
    buttonColor.value = '#54CEAB'
  }
  getMsgList()
  getIndexToolsDataFn()
  chatIm()
  IMlogin()
  getChatNoOrYes(o?.uid)
  messageIsRead({ uid: o?.uid, transaction_type: o?.chat_type })
})
const babylist = ref([])
function emitfunc() {
  uni.$on('babyList', (res) => {
    babylist.value = res
  })
}
const authpup = ref()
const authpupAuth = ref()
const props = defineProps<{
  uid: any
  avatar: any
  name: any
  chat_type: any
  childId: any
}>()
const babydetail = ref()
async function getbabydetail(d) {
  const res = await getBabyDetails(d)
  babydetail.value = res.data
}
async function getChatNoOrYes(uid) {
  try {
    const res = await getChatIsOk({ uid, type: props?.chat_type })
    isChat_is_ok.value = res.data
    console.log(res.data, '是否可以聊天')
  } catch (error) {
    console.log(error)
  }
}
onShow(() => {
  myAvatar.value = store?.userInfo?.avatar
  if (props.chat_type == 1 || props.chat_type == 3) {
    getalldate(children_user_id.value)
    gettMotiondate(children_user_id.value)
    getSleepdate(children_user_id.value)
  }
  // getDoctor(props?.id)
  //添加常用后显示
  if (configType.value != 0) {
    getMsgConfigList(configType.value)
  }
})
// const DoctorInfo = ref()
// async function getDoctor(doctorId) {
//   const res = await getDoctorInfo({ doctor_id: doctorId })
//   if (res?.code == 200) {
//     DoctorInfo.value = res.data.detail
//   }
// }
onReady(() => {
  height()
})
const userinfo = ref()
function IMlogin() {
  const token = store?.token
  if (token) {
    const store = useMemberStore()
    var user_sig = store.im?.user_sig
    let promiseLogin = uni.chat.login({
      userID: store?.userInfo?.doctor_im_id?.toString(),
      userSig: store?.im?.user_sig,
    })
    promiseLogin
      .then(function (imResponse) {
        console.log(imResponse.data, '登录成功') // 登录成功
        if (imResponse.data.repeatLogin === true) {
          // 标识账号已登录，本次登录操作为重复登录。
          console.log(imResponse.data.errorInfo, ' 标识账号已登录，本次登录操作为重复登录')
          let promise = uni.chat.logout()
          promise
            .then(function (imResponse) {
              console.log('登出成功', imResponse.data) // 登出成功
              let promise = uni.chat.login({
                userID: store?.userInfo?.doctor_im_id?.toString(),
                userSig: store?.im?.user_sig,
              })
              promise
                .then(function (imResponse) {
                  getIm()
                })
                .catch(function (imError) {
                  console.warn('login error:', imError) // 登录失败的相关信息
                })
            })
            .catch(function (imError) {
              console.warn('logout error:', imError)
            })
        }
      })
      .catch(function (imError) {
        console.log('登录失败的相关信息:', imError) // 登录失败的相关信息
      })
    let onMessageReceived = function (event) {
      messageIsRead({ uid: props?.uid, transaction_type: props?.chat_type })
      var list = msgTimeFormat(event.data, 0, 0)
      for (var i in list) {
        if (props.uid == list[i].from && list[i].cloudCustomData != 'baby') {
          messageList.value.push(list[i])
        }
        if (list[i].cloudCustomData == 'baby') {
          getbabydetail({ uid: props?.uid, child_id: list?.[i].payload?.text })
        }
      }
    }
    uni.chat.on(TencentCloudChat.EVENT.MESSAGE_RECEIVED, onMessageReceived)
    uni.chat.on(TencentCloudChat.EVENT.SDK_READY, onSdkReady)
  }
}
let onSdkReady = function (event) {
  let promises = uni.chat.setSelfStatus({ customStatus: '1' })
  // var conversationID = 'C2C' + props.uid
  // uni.chat
  //   .getMessageList({
  //     conversationID: conversationID,
  //   })
  //   .then(function (imResponse) {
  //     // 消息列表。
  //     nextReqMessageID.value = imResponse.data.nextReqMessageID // 用于续拉，分页续拉时需传入该字段。
  //     isCompleted.value = imResponse.data.isCompleted
  //     messageList.value = msgTimeFormat(
  //       uniqueObjectArray([...temporarilyList.value, ...imResponse.data.messageList]),
  //       0,
  //       0,
  //     )
  //   })
  setTimeout(() => {
    getuserStatus()
  }, 300)
  console.log(messageList.value)
}
function isdetail(data) {
  const arr = Object.values(data)
  const newarr = []
  for (let index = 0; index < arr.length; index++) {
    if (arr[index] != null) {
      newarr.push(arr[index])
    }
  }
  return newarr
}
function uniqueObjectArray(arr) {
  const uniqueArray = []
  arr.forEach((item) => {
    const index = uniqueArray.findIndex((i) => i?.ID === item?.ID)
    if (index === -1) {
      uniqueArray.push(item)
    }
  })
  return uniqueArray
}
function getuserStatus() {
  // 查询其他用户的状态
  let promises = uni.chat.getUserStatus({ userIDList: [props.uid] })
  promises
    .then(function (imResponse) {
      const { successUserList, failureUserList } = imResponse.data
      // 查询成功的用户列表

      isOnline.value = successUserList?.[0]?.statusType
    })
    .catch(function (imError) {
      console.warn('getUserStatus error:', imError) // 获取用户状态失败的相关信息
    })
}
function getIm() {
  // 修改个人标配资料
  const store = useMemberStore()
  let promise = uni.chat.updateMyProfile({
    nick: store.userInfo?.nickname,
    avatar: store.userInfo?.avatar,
  })
  promise.then(function (imResponse) {
    console.log(imResponse.data) // 更新资料成功
  })
}
const isOnline = ref(0)
const isScroll = ref(true)
function getMore() {
  isScroll.value = false
  // 下拉查看更多消息
  // var conversationID = 'C2C' + props.uid
  // uni.chat
  //   .getMessageList({
  //     conversationID: conversationID,
  //     nextReqMessageID: nextReqMessageID.value,
  //   })
  //   .then(function (imResponse) {
  //     const list = msgTimeFormat(imResponse.data.messageList, 0, 0) // 消息列表。
  //     nextReqMessageID.value = imResponse.data.nextReqMessageID // 用于续拉，分页续拉时需传入该字段。
  //     isCompleted.value = imResponse.data.isCompleted
  //     messageList.value = list.concat(messageList.value)
  //   })
  if (testMsgList.value.length == messagetoalt.value) {
    finished.value = true
  } else {
    paramsMsg.value.page++
    getMsgList()
  }
}
const scrollIndex = ref()

function bindScroll() {
  getMore()
}
function isscroll() {
  // if (isFocus.value && iptVal.value) {
  //   isFocus.value = false
  //   uni.hideKeyboard()
  // }
}
const messagetoalt = ref(0)
const finished = ref(false)
const testMsgList = ref([])
const paramsMsg = ref({
  page: 1,
  limit: 30,
  to_uid: '',
  transaction_type: 1,
})

async function getMsgList() {
  if (finished.value) return
  paramsMsg.value.to_uid = props?.uid
  paramsMsg.value.transaction_type = props?.chat_type
  const res: any = await getdoctorChatlist(paramsMsg.value)
  if (!messageList.value.length) {
    if (res?.data?.data?.length) {
      messageList.value = msgTimeFormat(res.data.data, 0, 0)
      testMsgList.value = res.data.data
      messagetoalt.value = res.data.total
    }
  } else {
    messageList.value.unshift(...msgTimeFormat(res.data.data, 0, 0))
    testMsgList.value.push(...res.data.data)
  }
}
onPageScroll(() => {
  if (isFocus.value) {
    isFocus.value = false
    uni.hideKeyboard()
  }
})
const bottominfo = ref()
const topinfo = ref()
const allheight = ref()

function height() {
  uni
    .createSelectorQuery()
    .select('.bottom1')
    .boundingClientRect((rect) => {
      bottominfo.value = Math.floor(rect?.height) * 2
    })
    .exec()
  uni
    .createSelectorQuery()
    .select('.top_nav')
    .boundingClientRect((rec) => {
      topinfo.value = Math.floor(rec?.height) * 2
    })
    .exec()

  // allheight.value = bottominfo.value + topinfo.value
  // console.log(bottominfo.value, topinfo.value)
}
const isscrolldone = ref(false)
watch(
  () => messageList.value,
  (r) => {
    if (isScroll.value) {
      scrollIndex.value = ''
      nextTick(() => {
        // isscrolldone.value = true
        height()
        setTimeout(() => {
          scrollIndex.value = 'scroll' + messageList.value[messageList?.value?.length - 1]?.ID
        }, 500)
      })
    }
  },
  {
    deep: true,
  },
)
uni.$on('goback', (data: any) => {
  console.log(data)
  scrollIndex.value = ''
  nextTick(() => {
    setTimeout(() => {
      scrollIndex.value = 'scroll' + data
    }, 500)
  })
})
uni.$on('clearall', (data: any) => {
  // 清空单聊的本地及云端的消息
  console.log('isok', data) // 清空消息失败的相关信息

  let promise = uni.chat.clearHistoryMessage('C2C' + data)
  promise
    .then(function (imResponse) {
      messageList.value = []
      console.log('isok', imResponse) // 清空消息失败的相关信息
      // 清空消息成功
    })
    .catch(function (imError) {
      console.warn('clearHistoryMessage error:', imError) // 清空消息失败的相关信息
    })
})
const weightReduceInfo = ref([])
const dietReduceInfo = ref([])
const motionReduceInfo = ref([])
const sleepReduceInfo = ref([])

async function getweight() {
  try {
    const res = await getWeight()
    if (res?.code == 400) {
      uni.showToast({
        title: res.msg,
        icon: 'none',
      })
    } else {
      popupShow.value = true
      titlea.value = '确认发送体重记录'
      weightReduceInfo.value = res?.data
    }
  } catch (error) {
    console.log(error)
  }
}
async function getdiet() {
  try {
    const res = await getDiet()
    if (res?.code == 400) {
      uni.showToast({
        title: res.msg,
        icon: 'none',
      })
    } else {
      show.value = true
      titlea.value = '确认发送饮食记录'
      dietReduceInfo.value = res?.data?.data
    }
  } catch (error) {
    console.log(error)
  }
}
async function getmotion() {
  try {
    const res = await getMotion()
    if (res?.code == 400) {
      uni.showToast({
        title: res.msg,
        icon: 'none',
      })
    } else {
      show.value = true
      titlea.value = '确认发送运动记录'
      motionReduceInfo.value = res?.data?.data
    }
  } catch (error) {
    console.log(error)
  }
}
async function getsleep() {
  try {
    const res = await getSleep()
    if (res?.code == 400) {
      uni.showToast({
        title: res.msg,
        icon: 'none',
      })
    } else {
      show.value = true
      titlea.value = '确认发送睡眠记录'
      sleepReduceInfo.value = res?.data?.data
    }
  } catch (error) {
    console.log(error)
  }
}
const dietDate = ref()
const dietMotion = ref()
const dietSleep = ref()
async function getalldate(child_id) {
  try {
    const res1 = await getDiet({ uid: props?.uid, form: props.chat_type, child_id })
    console.log(res1)
    dietDate.value = res1?.data?.data?.date
  } catch (e) {
    console.log(e)
  }
}
async function gettMotiondate(child_id) {
  try {
    const res2 = await getMotion({ uid: props?.uid, form: props.chat_type, child_id })
    dietMotion.value = res2?.data?.data?.date
  } catch (e) {
    console.log(e)
  }
}
async function getSleepdate(child_id) {
  try {
    const res3 = await getSleep({ uid: props?.uid, form: props.chat_type, child_id })
    dietSleep.value = res3?.data?.data?.date
  } catch (e) {
    console.log(e)
  }
}
//某一天睡眠记录
async function getSomedaySleep(e) {
  try {
    const res = await getSleep({ date: e, form: props.chat_type })
    console.log(res)
    if (res?.code == 400) {
      uni.showToast({
        title: res.msg,
        icon: 'none',
      })
    } else {
      sendCustomMessage('7', res?.data?.data)
    }
  } catch (error) {
    console.log(error)
  }
}
//某一天睡眠记录
async function getSomedaysport(e) {
  try {
    const res = await getMotion({ date: e, form: props.chat_type })
    console.log(res)
    if (res?.code == 400) {
      uni.showToast({
        title: res.msg,
        icon: 'none',
      })
    } else {
      sendCustomMessage('6', res?.data?.data)
    }
  } catch (error) {
    console.log(error)
  }
}
//某一天睡眠记录
async function getSomedayeat(e) {
  try {
    const res = await getDiet({ date: e, form: props.chat_type })
    console.log(res)
    if (res?.code == 400) {
      uni.showToast({
        title: res.msg,
        icon: 'none',
      })
    } else {
      sendCustomMessage('5', res?.data?.data)
    }
  } catch (error) {
    console.log(error)
  }
}
//end
const show = ref(false)
const sendType = ref()
function onMore(type: any) {
  sendType.value = type
  if (type == 1) {
    showConfig.value = false
    toSendImg('album')
  } else if (type == 2) {
    showConfig.value = false
    toSendImg('camera')
  } else if (type == 3) {
    showConfig.value = false
    if (userinfo.value.name) {
      openInfo()
    } else {
      uni.showToast({
        title: '请前往孕产跟踪填写信息',
        icon: 'none',
      })
    }
  } else if (type == 4) {
    showConfig.value = false
    // openInspection()
  } else if (type == 5) {
    showConfig.value = false
    getweight()
  } else if (type == 6) {
    showConfig.value = false
    getdiet()
    list.value = [
      { name: '最近一次饮食记录', count: 1 },
      { name: '近7天饮食记录', count: 7 },
      { name: '近14天饮食记录', count: 14 },
      { name: '近30天饮食记录', count: 30 },
      { name: '全部饮食记录', count: 'all' },
    ]
  } else if (type == 7) {
    showConfig.value = false
    getmotion()
    list.value = [
      { name: '最近一次运动记录', count: 1 },
      { name: '近7天运动记录', count: 7 },
      { name: '近14天运动记录', count: 14 },
      { name: '近30天运动记录', count: 30 },
      { name: '全部运动记录', count: 'all' },
    ]
  } else if (type == 8) {
    showConfig.value = false
    toSearchShop()
  } else if (type == 9) {
    showConfig.value = false
    getsleep()
    list.value = [
      { name: '最近一次睡眠记录', count: 1 },
      { name: '近7天睡眠记录', count: 7 },
      { name: '近14天睡眠记录', count: 14 },
      { name: '近30天睡眠记录', count: 30 },
      { name: '全部睡眠记录', count: 'all' },
    ]
  } else if (type == 10) {
    showConfig.value = false
    getarticleList()
  } else if (type == 11) {
    showConfig.value = true
    isShowNo.value = false
    configType.value = 2
    getMsgConfigList(2)
  } else if (type == 12) {
    showConfig.value = true
    isShowNo.value = false
    configType.value = 1
    getMsgConfigList(1)
  }
}
//获取常用建议列表
const showConfig = ref(false)
const MsgConfigList = ref([])
const isShowNo = ref(false)
async function getMsgConfigList(type) {
  const res = await commonToolsMessageConfigList({ type: type })
  if (res?.code == 200) {
    isShowNo.value = true
    MsgConfigList.value = res?.data
  }
}
//添加常用
const configType = ref(0)
const addMsgConfig = () => {
  configType.value == 2
    ? navigateTo(`/common/suggest/add?title=添加常用回复`)
    : navigateTo(`/common/suggest/add?title=添加常用建议`)
}
//设置常用
const setMsgConfig = () => {
  configType.value == 2
    ? navigateTo('/common/suggest/index?type=2')
    : navigateTo('/common/suggest/index?type=1')
}
//点击某条常用建议
const msgItemChage = (i) => {
  iptVal.value = i
}
//
const articleList = ref([])
function getarticleList() {
  articleShow.value = true
}
// 选择上传的照片
const resUrl = ref()
const pic_type = ref()
function toSendImg(type: any) {
  pic_type.value = type
  nextTick(() => {
    authpup.value.open()
  })
}

function uploadImg(img: any) {
  isScroll.value = true
  let message = uni.chat.createImageMessage({
    to: props.uid,
    conversationType: TencentCloudChat.TYPES.CONV_C2C,
    payload: {
      file: img,
    },
    onProgress: function (event) {
      console.log('file uploading:', event)
    },
  })
  // 2. 发送消息
  uni.chat
    .sendMessage(message)
    .then(function (imResponse) {
      uni.hideLoading()
      console.log(imResponse.data.message, '发送图片消息')
      let testList = msgTimeFormat([...messageList.value, imResponse.data.message], 0, 0)
      if (testList[testList.length - 2].type == 'showTime') {
        messageList.value.push(testList[testList.length - 2])
        messageList.value.push(testList[testList.length - 1])
      } else {
        messageList.value.push(imResponse.data.message)
      }
      sendChatMsg({
        to_uid: props?.uid,
        type: 3,
        content: imResponse.data.message,
        transaction_type: props.chat_type,
      })
    })
    .catch(function (imError) {
      // 发送失败
      uni.hideLoading()
      console.warn('sendMessage error:', imError)
    })
}

// 获取个人主页信息
const userPage = ref()

// 关注
async function followFn() {
  const res = await followCreate({
    follow_user_id: userPage.value?.id,
  })
  if (res.code == 10000) {
    uni.showToast({
      title: '关注成功',
      icon: 'none',
    })
    // getUserPageFn()
  }
}

// 打开授权
function changeAuth() {
  uni.chooseImage({
    count: 1, //默认9
    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
    sourceType: [pic_type.value], //从相册选择
    success: function (res) {
      uploadImg(res)
      uni.showLoading({
        title: '发送中',
      })
    },
  })
}

// 打开音频授权
function changeAuthAudio(e) {
  if (os.value == 'android') {
    if (e) {
      audioShow.value = !audioShow.value
      recordAuth.value = true
    } else {
      // 拒绝授权
      uni.showModal({
        content: '检测到您没打开录音功能权限，是否去设置打开？',
        confirmText: '确认',
        confirmColor: '#1874f5',
        cancelText: '取消',
        success: (res) => {
          if (res.confirm) {
            uni.openAppAuthorizeSetting({
              success(res) {
                console.log(res)
              },
            })
          } else {
            return false
          }
        },
      })
    }
    if (audioShow.value && recordAuth.value) {
      isFocus.value = false
    } else {
      isFocus.value = true
    }
    nextTick(() => {
      height()
    })
  } else {
    record()
  }
}
// 获取与目标用户的聊天记录
const chatMsgListQuery = ref({
  receive_user_id: props.doctor_id,
  last_id: 0,
  rows: 100,
})
const chatMsgList = ref([])
async function getChatMsgListFn() {
  const res = await getChatMsgList(chatMsgListQuery.value)
  chatMsgList.value = res.data.data
  chatMsgListQuery.value.rows = res.data.total + 1
}

function onshowImg() {
  showImg.value = !showImg.value
  audioShow.value = false
  isFocus.value = false
  scrollIndex.value = ''
  nextTick(() => {
    height()
    setTimeout(() => {
      scrollIndex.value = 'scroll' + messageList.value[messageList?.value?.length - 1]?.ID
    }, 500)
  })
}
async function sendChatMsgFn(t?: any) {
  if (!iptVal.value)
    return uni.showToast({
      title: '请输入内容',
      icon: 'none',
    })
  isScroll.value = true
  // 发送文本消息，Web 端与小程序端相同
  // 1. 创建消息实例，接口返回的实例可以上屏
  let message = uni.chat.createTextMessage({
    to: props.uid,
    conversationType: TencentCloudChat.TYPES.CONV_C2C,
    payload: {
      text: iptVal.value,
    },
    // 如果您发消息需要已读回执，需购买旗舰版套餐，并且创建消息时将 needReadReceipt 设置为 true
    // needReadReceipt: true,
    // 消息自定义数据（云端保存，会发送到对端，程序卸载重装后还能拉取到）
    cloudCustomData: t,
  })
  // 2. 发送消息
  let promise = uni.chat.sendMessage(message)
  promise
    .then(function (imResponse) {
      // 发送成功
      let testList = msgTimeFormat([...messageList.value, imResponse.data.message], 0, 0)
      if (testList[testList.length - 2].type == 'showTime') {
        messageList.value.push(testList[testList.length - 2])
        messageList.value.push(testList[testList.length - 1])
      } else {
        messageList.value.push(imResponse.data.message)
      }
      console.log(testList, messageList.value)
      sendChatMsg({
        to_uid: props.uid,
        type: 0,
        content: imResponse.data.message,
        transaction_type: props.chat_type,
      })
      nextTick(() => {
        iptVal.value = ''
      })
    })
    .catch(function (imError) {
      // 发送失败
      console.warn('sendMessage error:', imError)
    })
}
function onfocus() {
  showImg.value = false
  showConfig.value = false
  isFocus.value = true
  scrollIndex.value = ''
  nextTick(() => {
    height()
  })
  setTimeout(() => {
    scrollIndex.value = 'scroll' + messageList.value[messageList?.value?.length - 1]?.ID
  }, 500)
}
function onblur() {
  showImg.value = false
  // isFocus.value = false
  nextTick(() => {
    height()
  })
}
function onScroll() {
  showImg.value = false
  showConfig.value = false
  nextTick(() => {
    height()
  })
}
// const personpopup = ref()
// function openInfo() {
//   personpopup.value.open()
// }
const carSearchShow = ref(false)
const articleShow = ref(false)
const toSearchShop = () => {
  cartTrolleyList.value = []

  carSearchShow.value = true
  // focus.value = true
  getCollect()
  showTab.value = true
}
const carKeyword = ref('')
const searchDisabled = ref(false)
const current = ref(0)
const chooseCount = ref(0)
const chooseAll = ref(false)
const tabList = ref([{ name: '收藏' }, { name: '购物车' }, { name: '浏览足迹' }])
const articletabList = ref([{ name: '我的发布' }, { name: '收藏' }, { name: '点赞' }])
const cartTrolleyList = ref([])
const handleChangeTab = (e: any) => {
  current.value = e.index
  cartTrolleyList.value = []
  params.value.page = 1
  finised_pop.value = false
  total_pop.value = 0
  chooseCount.value = 0
  chooseAll.value = false
  switch (e.index) {
    case 0:
      getCollect()
      break
    case 1:
      getCart()
      break
    case 2:
      getHistory()
      break
  }
}
const toSearchPopup = () => {
  cartTrolleyList.value = []
  if (current.value == 0) {
    getCollect()
  } else if (current.value == 1) {
    getCart()
  } else if (current.value == 2) {
    getHistory()
  }
  showTab.value = true
}
const getSearchList = () => {}
const clearSearch = () => {
  focus.value = false
  carKeyword.value = ''
  if (current.value == 0) {
    getCollect()
  } else if (current.value == 1) {
    getCart()
  } else if (current.value == 2) {
    getHistory()
  }
  showTab.value = true
}
const focus = ref(false)
function moveHandle() {
  return false
}
const showTab = ref(false)
const noList = ref(false)
const closeSearcharticle = () => {
  articleShow.value = false
}
function sendArticle(i) {
  console.log(i)
  i.forEach((item) => {
    if (item?.check) {
      articleShow.value = false
      sendCustomMessage('8', item)
    }
  })
  uni.showToast({
    title: '发送成功',
    icon: 'none',
  })
}
const closeSearchCart = () => {
  carSearchShow.value = false
  current.value = 0
  focus.value = false
  params.value.page = 1
  finised_pop.value = false
  total_pop.value = 0
  carKeyword.value = ''
  chooseCount.value = 0
  chooseAll.value = false
  showTab.value = false
  cartTrolleyList.value = []
}
const isnoshowtab = ref(false)
const handleFocus = () => {
  isnoshowtab.value = true
  showTab.value = false
  focus.value = true
  cartTrolleyList.value = []
  noList.value = false
}
const handleBlur = () => {
  isnoshowtab.value = false
  focus.value = false
  showTab.value = true
  toSearchPopup()
  // getCollect()
}
const openSearchCart = () => {
  carSearchShow.value = true
  // focus.value = true
}
const openSearchArticle = () => {
  carSearchShow.value = true
  // focus.value = true
}

const goodsCheckCart = (item: any) => {
  item.check = !item.check
  if (item.check) {
    chooseCount.value += 1
  } else {
    chooseCount.value -= 1
  }
  chooseCount.value == cartTrolleyList.value.length
    ? (chooseAll.value = true)
    : (chooseAll.value = false)
}
const params = ref({
  page: 1,
  limit: 10,
  keyword: '',
})
const finised_pop = ref(false)
const total_pop = ref(0)
const last_page = ref(0)
// 获取收藏列表
const getCollect = async () => {
  try {
    params.value.keyword = carKeyword.value
    let arr = []
    const res1 = await getCollectList(params.value)
    if (!cartTrolleyList.value.length) {
      cartTrolleyList.value = res1.data.data
      total_pop.value = res1.data.total
    } else {
      cartTrolleyList.value.push(...res1.data.data)
    }
    if (res1?.data?.data?.length == 0) {
      noList.value = true
    }
  } catch (error) {
    // 请求失败处理
    uni.showToast({ title: '请求失败' })
  }
}
// 处理接口返回数据
const handleCollectData = (data: any) => {
  cartTrolleyList.value = data
}

// 获取购物车列表
const getCart = async () => {
  params.value.keyword = carKeyword.value
  const res = await getCartList(params.value)
  if (!cartTrolleyList.value.length) {
    cartTrolleyList.value = res.data.data
    total_pop.value = res.data.total
  } else {
    cartTrolleyList.value.push(...res.data.data)
  }
  if (res?.data?.data?.length == 0) {
    noList.value = true
  }
  last_page.value = res.data.last_page
}
// 获取浏览记录列表
const getHistory = async () => {
  params.value.keyword = carKeyword.value
  params.value.type = 1
  const res = await getHistoryList(params.value)
  if (!cartTrolleyList.value.length) {
    cartTrolleyList.value = res.data.data
    total_pop.value = res.data.total
  } else {
    cartTrolleyList.value.push(...res.data.data)
  }
  if (res?.data?.data?.length == 0) {
    noList.value = true
  }
  last_page.value = res.data.last_page
}
function listScroll() {
  if (cartTrolleyList.value.length == total_pop.value) {
    finised_pop.value = true
  } else {
    params.value.page++
    switch (current.value) {
      case 0:
        getCollect()
        break
      case 1:
        getCart()
        break
      case 2:
        getHistory()
        break
    }
  }
}

const clickTotalizeCart = () => {
  if (chooseAll.value) {
    chooseAll.value = false
    cartTrolleyList.value.map((item) => {
      item.allCheck = false
      item.check = false
    })
    chooseCount.value = 0
  } else {
    chooseAll.value = true
    cartTrolleyList.value.map((item) => {
      item.allCheck = true
      item.check = true
    })
    chooseCount.value = cartTrolleyList.value.length
  }
}
const sendCart = () => {
  cartTrolleyList.value.forEach((item) => {
    if (item?.check) {
      carSearchShow.value = false
      sendCustomMessage('2', item)
    }
  })
  current.value = 0
  focus.value = false
  carKeyword.value = ''
  chooseCount.value = 0
  chooseAll.value = false
  params.value.page = 1
  finised_pop.value = false
  total_pop.value = 0
  uni.showToast({
    title: '发送成功',
    icon: 'none',
  })
}
function previewImg(img: any) {
  uni.previewImage({
    urls: [img],
    fail: (err) => {
      console.log(err)
    },
  })
}

function playing(index: any) {
  let currentIndex = 'myVideo' + index // 获取当前视频索引
  var list = messageList.value
  for (var i in list) {
    let temp = 'myVideo' + i
    if (temp != currentIndex) {
      //判断名字是否一致
      // 暂停其余视频
      uni.createVideoContext(temp).pause() //暂停视频播放事件
    }
  }
}
var playAudioId = ref('')

function endAudio() {
  playAudioId.value = ''
}

function gotoMsg() {
  uni.navigateTo({
    url: `./doctor-chat-message?doctor_id=${props?.uid}&avatar=${props?.avatar}&nickname=${props.name}&id=${props?.uid}&chat_type=${props?.chat_type}`,
  })
  isFocus.value = false
}
const goItem = (item: any) => {
  if (item.source_from == 1) {
    navigateTo(`/pagesS/goodsDetail/goodsDetail?id=${item.product_id}`, 0)
  } else if (item.source_from == 2) {
    navigateTo(`/pagesF/goodsDetails/index?id=${item.product_id}`, 0)
  } else if (item.source_from == 3) {
    navigateTo(`/pagesG/goodsDetails/index?id=${item.product_id}`, 0)
  }
}
onUnmounted(() => {
  try {
    // #ifdef APP-PLUS || APP-IOS
    uni.onKeyboardHeightChange(listener)
    // #endif
    uni.chat.logout()
    innerAudioContext.pause()
  } catch (e) {
    console.log(e)
  }
  // if (props.uid) {
  //   setMsgList.value[props.uid] = messageList.value
  //   uni.setStorageSync('chatMsgList', setMsgList.value)
  // }
})
// onHide(() => {
//   if (props.uid) {
//     setMsgList.value[props.uid] = messageList.value
//     uni.setStorageSync('chatMsgList', setMsgList.value)
//   }
// })

const personpopup = ref()

function openInfo() {
  personpopup.value.open()
}

function sendCustomMessage(type, data) {
  isScroll.value = true
  // 2. 创建消息实例，接口返回的实例可以上屏
  let message = uni.chat.createCustomMessage({
    to: props.uid,
    conversationType: TencentCloudChat.TYPES.CONV_C2C,
    // 消息优先级，用于群聊。如果某个群的消息超过了频率限制，后台会优先下发高优先级的消息，详细请参考：https://cloud.tencent.com/document/product/269/3663#.E6.B6.88.E6.81.AF.E4.BC.98.E5.85.88.E7.BA.A7.E4.B8.8E.E9.A2.91.E7.8E.87.E6.8E.A7.E5.88.B6)
    // 支持的枚举值：TencentCloudChat.TYPES.MSG_PRIORITY_HIGH, TencentCloudChat.TYPES.MSG_PRIORITY_NORMAL（默认）, TencentCloudChat.TYPES.MSG_PRIORITY_LOW, TencentCloudChat.TYPES.MSG_PRIORITY_LOWEST
    // priority: TencentCloudChat.TYPES.MSG_PRIORITY_HIGH,
    payload: {
      data: type, // 用于标识该消息是骰子类型消息
      description: String(reduce_num.value), // 获取骰子点数
      extension: JSON.stringify(data),
    },
  })
  console.log(message, data, '555555555555555')

  // 3. 发送消息
  let promise = uni.chat.sendMessage(message)
  promise
    .then(function (imResponse) {
      // 发送成功
      let testList = msgTimeFormat([...messageList.value, imResponse.data.message], 0, 0)
      if (testList[testList.length - 2].type == 'showTime') {
        messageList.value.push(testList[testList.length - 2])
        messageList.value.push(testList[testList.length - 1])
      } else {
        messageList.value.push(imResponse.data.message)
      }
      sendChatMsg({
        to_uid: props.uid,
        type: 1,
        content: imResponse.data.message,
        transaction_type: props.chat_type,
      })
    })
    .catch((res) => {
      uni.showToast({
        title: '发送失败，该条文章体积过大',
        icon: 'none',
        mask: true,
      })
    })
}

//语音发送
const audioShow = ref(false)
const recordAuth = ref(false) // 是否授权录音
// 录音
// #ifdef APP-PLUS || APP-IOS || APP-ANDROID
const recorderManager = uni.getRecorderManager() // 录音管理对象
// #endif
let init: any = null // 录制时长计时器
let timer: any = null // 播放 录制倒计时
const count = ref(0) // 录制倒计时
const longPress = ref(1) // 1显示 按住说话 2显示 说话中
// 音频
const innerAudioContext = uni.createInnerAudioContext() // audio 上下文对象
const time = ref(0) //录音时长
const duration = ref(60000) //录音最大值ms 60000/1分钟
const tempFilePath: any = ref('') //音频路径
const playStatus = ref(0) //录音播放状态 0:未播放 1:正在播放
const voiceAllTime = ref(0) //记录音频原始总时长
function toAudio() {
  showImg.value = false
  showConfig.value = false
  nextTick(() => {
    authpupAuth.value.open()
  })
}

function recordingTimer(_time: any) {
  if (_time == undefined) {
    // 将计时器赋值给init
    init = setInterval(() => {
      time.value++
    }, 1000)
  } else {
    clearInterval(init)
  }
}

// 长按录音事件
function longpressBtn() {
  if (!recordAuth.value) {
    return
  }
  longPress.value = 2
  clearInterval(init) // 清除定时器
  countdown(60) // 倒计时
  recorderManager.onStop((res) => {
    tempFilePath.value = res.tempFilePath
    recordingTimer(time.value)
  })
  const options = {
    duration: duration.value, // 指定录音的时长，单位 ms
    sampleRate: 16000, // 采样率
    numberOfChannels: 1, // 录音通道数
    encodeBitRate: 96000, // 编码码率
    format: 'mp3', // 音频格式，有效值 aac/mp3
    frameSize: 10, // 指定帧大小，单位 KB
  }
  recordingTimer(undefined)
  recorderManager.start(options)
  // 监听音频开始事件
  recorderManager.onStart((res) => {
    console.log(res)
  })
}

// 长按松开录音事件
function touchendBtn() {
  //		if(!recordAuth.value) {
  //			return;
  //		}

  longPress.value = 1
  recorderManager.onStop((result) => {
    // console.log(result)
    // 录音结束，可以先调用删除接口将旧录音删除，然后再上传最新的录音
    // 通过 uni.uploadFile 上传录音文件，filePath 传 voice.tempFilePath，指定要上传文件资源路径
    // 下面是示例，模拟上传成功之后的处理
    // tempFilePath.value = "https://web-ext-storage.dcloud.net.cn/uni-app/ForElise.mp3";
    // innerAudioContext.src = "https://web-ext-storage.dcloud.net.cn/uni-app/ForElise.mp3";
    tempFilePath.value = result.tempFilePath
    innerAudioContext.src = result.tempFilePath
    // time.value = (result.duration / 1000).toFixed(1)
    // voiceAllTime.value = result.duration
    // console.log(count.value, '---------------')
    let time = 60 - count.value
    if (time == 0) {
      uni.showToast({
        title: '说话时间太短了',
        icon: 'none',
      })
    } else {
      sendAudio(result, time)
    }
  })
  recordingTimer(time.value)
  clearInterval(timer)
  recorderManager.stop()
}

function sendAudio(url: any, ti: any) {
  console.log(ti, '-------------------')
  isScroll.value = true
  let message = uni.chat.createAudioMessage({
    to: props.uid,
    conversationType: TencentCloudChat.TYPES.CONV_C2C,
    payload: {
      file: url,
    },
    cloudCustomData: String(ti),
    onProgress: function (event) {
      console.log('file uploading:', event)
    },
  })
  // 2. 发送消息
  uni.chat
    .sendMessage(message)
    .then(function (imResponse) {
      uni.hideLoading()
      let testList = msgTimeFormat([...messageList.value, imResponse.data.message], 0, 0)
      if (testList[testList.length - 2].type == 'showTime') {
        messageList.value.push(testList[testList.length - 2])
        messageList.value.push(testList[testList.length - 1])
      } else {
        messageList.value.push(imResponse.data.message)
      }
      sendChatMsg({
        to_uid: props.uid,
        type: 4,
        content: imResponse.data.message,
        transaction_type: props.chat_type,
      })
    })
    .catch(function (imError) {
      // 发送失败
      uni.hideLoading()
    })
}
// 倒计时
function countdown(val: any) {
  count.value = Number(val)
  timer = setInterval(() => {
    if (count.value > 0) {
      count.value--
    } else {
      longPress.value = 1
      clearInterval(timer)
    }
  }, 1000)
}

// 获取ids
function getids(e) {
  reduceids.value = []
  e.forEach((i) => {
    reduceids.value.push(i?.id)
  })
  return reduceids.value.join(',')
}

// 播放
function updateTime(val: number) {
  time.value = Number(val)
  timer = setInterval(() => {
    if (time.value >= 1) {
      time.value--
    } else {
      time.value = voiceAllTime.value
      clearInterval(timer)
    }
  }, 1000)
}
const isplay = ref(false)
const onPlay = ref()
function audioPlay(url, i) {
  onPlay.value = i
  //点击播放
  if (playStatus.value == 0) {
    isplay.value = true
    playStatus.value = 1
    innerAudioContext.src = url
    innerAudioContext.play()
    updateTime(time.value) // 倒计时
  } else {
    isplay.value = false
    playStatus.value = 0
    innerAudioContext.pause()
    clearInterval(timer)
  }
  //播放结束
  innerAudioContext.onEnded(() => {
    playStatus.value = 0
    isplay.value = false
  })
}
innerAudioContext.onError((res) => {
  isplay.value = false
  uni.showToast({
    title: '音频文件损坏',
    icon: 'none',
  })
})

function gotoShop(item: any) {
  if (item.payload.data == '2') {
    let data = JSON.parse(item.payload.extension)
    let i = data
    let type = data.source_from
    if (type == 1) {
      navigateTo(`/pagesS/goodsDetail/goodsDetail?id=${i.product_id}`, 0)
    } else if (type == 2) {
      navigateTo(`/pagesF/goodsDetails/index?id=${i.product_id}`, 0)
    } else if (type == 3) {
      navigateTo(`/pagesG/goodsDetails/index?id=${i.product_id}`, 0)
    }
  } else if (item.payload.data == '8') {
    let data = JSON.parse(item.payload.extension)
    let path = `/baby/science/index?id=${data?.id}`
    console.log(path)
    navigateTo(path, 0)
  }
}

const keyHeight = ref(0)

const os = ref()
const isnum = ref()
uni.getSystemInfo({
  success: (e) => {
    os.value = e.osName
    isnum.value = e.osName == 'android' ? 16 : -30
  },
})
function listener(res: any) {
  if (res.height) {
    nextTick(() => {
      keyHeight.value = res.height
    })
  } else {
    nextTick(() => {
      keyHeight.value = 0
    })
  }
}
// #ifdef APP-PLUS || APP-IOS
uni.onKeyboardHeightChange(listener)
// #endif
const reduceids = ref([])
function isTwoOrThree(e) {
  return e.some((item) => item?.status == 1)
}

const popupShow = ref(false)
const titlea = ref('')
const list: any = ref([])
function closeOverlay() {
  show.value = false
}
const send_type = ref()
const reduce_num = ref()
function geteatReduce(num) {}
const sendReduceMessage = ref()
function sendReduce(e) {
  sendReduceMessage.value = e.name
  reduce_num.value = e.count
  popupShow.value = true
  if (sendType.value == 6) {
    geteatReduce(e.count)
    send_type.value = 'eat'
  } else if (sendType.value == 7) {
    send_type.value = 'sport'
  } else if (sendType.value == 9) {
    send_type.value = 'sleep'
  }
}

function confirmClear() {
  popupShow.value = false
  isFocus.value = false
  if (sendType.value == 5) {
    sendCustomMessage('4', weightReduceInfo.value)
  } else if (sendType.value == 6) {
    sendCustomMessage('5', dietReduceInfo.value)
  } else if (sendType.value == 7) {
    sendCustomMessage('6', motionReduceInfo.value)
  } else if (sendType.value == 9) {
    sendCustomMessage('7', sleepReduceInfo.value)
  }
}

function gotosleep(day?: any, type, i) {
  let child_id = i?.child_id
  if (type == 4) {
    navigateTo(
      `/pregnancys/weight-management/weight-record?isshow=${false}&day=1&uid=${props?.uid}`,
    )
  } else if (type == 5) {
    if (!dietDate.value)
      return uni.showToast({
        title: '该记录已被删除',
        icon: 'none',
      })
    if(props?.chat_type == 3){
      navigateTo(
      `/pediatrics/weightManagement/dietaryRecords/addRecord?isshow=food&day=${day}&time=${dietMotion.value}&childId=${props?.childId}&userId=${props?.uid}`,
      )
    }else{
      navigateTo(
      `/pregnancys/weight-management/diet-record/foods-and-sport?isshow=food&day=${day}&time=${dietDate.value}&uid=${props?.uid}`,
      )
    }
  } else if (type == 6) {
    if (!dietMotion.value)
      return uni.showToast({
        title: '该记录已被删除',
        icon: 'none',
      })
    if(props?.chat_type == 3){
      navigateTo(
      `/pediatrics/weightManagement/dietaryRecords/addRecord?isshow=sport&day=${day}&time=${dietMotion.value}&childId=${props?.childId}&userId=${props?.uid}`,
      )
    }else{
      navigateTo(
        `/pregnancys/weight-management/diet-record/foods-and-sport?isshow=sport&day=${day}&time=${dietMotion.value}&uid=${props?.uid}`,
      )
    }
  } else if (type == 7) {
    if (!dietSleep.value)
      return uni.showToast({
        title: '该记录已被删除',
        icon: 'none',
      })
    if (props?.chat_type == 3) {
      navigateTo(
        `/pediatrics/weightManagement/sleepRecords/index?isshow=${false}&day=${day}&time=${
          dietSleep.value
        }&childId=${props?.childId}&userId=${props?.uid}`,
      )
    } else {
      navigateTo(
        `/pregnancys/weight-management/sleep-record/index?isshow=${false}&day=${day}&time=${
          dietSleep.value
        }&uid=${props?.uid}`,
      )
    }
  }
}

function gotopageuser() {
  const user = useMemberStore().userInfo
  if (user?.app_user_tag == 'official') {
    navigateTo(
      '/pages-users/my-page/official-doctor-home?tag=official&uid=' + user?.uid + '&is_self=' + 1,
    )
  } else if (user?.app_user_tag == 'doctor') {
    navigateTo(
      '/pages-users/my-page/official-doctor-home?tag=doctor&uid=' + user?.uid + '&is_self=' + 1,
    )
  } else {
    navigateTo(`/pages-users/my-page/index?is_self=0&uid=${user?.uid}&is_self=${1}`)
  }
}

function extractTextFromRichText(html) {
  const re1 = new RegExp('<.+?>', 'g') // 匹配html标签的正则表达式，"g"是搜索匹配多个符合的内容
  const arrEntities = {
    lt: '<',
    gt: '>',
    nbsp: ' ',
    amp: '&',
    quot: '"',
    ldquo: '“',
    mdash: '—',
    rdquo: '”',
  }

  return html
    ?.replace(re1, '')
    ?.replace(/&(lt|gt|nbsp|amp|quot|ldquo|mdash|rdquo);/gi, function (all, t) {
      return arrEntities[t]
    })
}

// const change_tabs = ref([{ name: '会话交流' }, { name: '患者资料' }, { name: '填写结果' }])
const change_tabs = ref([{ name: '会话交流' }, { name: '患者资料' }])
const current_tab = ref(0)
function changeCurrent(u) {
  current_tab.value = u
  swiper_current.value = u
}
const swiper_current = ref(0)
function swiper_change(e) {
  current_tab.value = e.detail.current
  swiper_current.value = e.detail.current
}
</script>

<template>
  <h-nav-bar
    class="top_nav"
    :title="props?.name || '患者'"
    :fixed="true"
    :isOnline="isOnline"
    color="#333"
    backgroundColor="#FFFFFF"
    @clickRight="gotoMsg"
  >
    <template #right>
      <view class="navbar_img" v-if="swiper_current == 0">
        <image src="@/static/yunchan/chat/gosearch.png" mode="widthFix" />
      </view>
    </template>
  </h-nav-bar>

  <!-- 会话列表 -->
  <view class="change_box">
    <view
      class="change_tabs"
      :style="{
        background: current_tab == index ? '#00C1B9' : '#FFF',
        color: current_tab == index ? '#FFF' : '#5C5C5C',
      }"
      @click="changeCurrent(index)"
      v-for="(item, index) of change_tabs"
      :key="index"
    >
      {{ item.name }}
    </view>
  </view>
  <view
    v-if="current_tab == 0 && props.chat_type == 3 && babylist.length >= 2"
    class="top_box"
    :style="{
      top: topinfo + 'rpx',
    }"
  >
    <view class="top flex-row-start">
      <view class="flex-row-start" style="flex: 1">
        当前正和您咨询的患者孩子：{{ babydetail?.baby_name }}
      </view>
    </view>
  </view>
  <swiper
    :style="{
      'margin-top': `${props.chat_type == 3 ? topinfo : 0 + 'rpx'}`,
      height: `calc(100vh - ${
        (swiper_current == 0 ? bottominfo : 0) +
        88 +
        topinfo +
        (swiper_current == 0 ? keyHeight * 2 : 0) +
        (swiper_current == 0 ? isnum : 0) +
        'rpx'
      })`,
    }"
    class="swiper"
    @change="swiper_change"
    :circular="false"
    :autoplay="false"
    :indicator-dots="false"
    :current="swiper_current"
  >
    <swiper-item>
      <scroll-view
        :style="{
          height: `calc(100vh - ${
            bottominfo +
            88 +
            topinfo +
            keyHeight * 2 +
            (props.chat_type == 3 ? 68 : 0) +
            isnum +
            'rpx'
          })`,
        }"
        class="container1 scroll"
        :scroll-y="true"
        :scroll-into-view="scrollIndex"
        :scroll-with-animation="true"
        @scrolltoupper="bindScroll"
        @click="onScroll"
        @scroll="isscroll"
      >
        <view class="section chat" ref="chat">
          <view
            v-for="(item, index) in messageList"
            :key="index"
            class="message_item"
            :style="{
              marginBottom: item?.type == 'showTime' ? '13rpx' : '37rpx',
            }"
            :id="'scroll' + item?.ID"
          >
            <!-- 时间 -->
            <text class="time-line" style="font-size: 20rpx" v-if="item?.type == 'showTime'">
              {{ item.payload.text }}
            </text>

            <text class="isonline" v-if="item?.cloudCustomData == 'isnoline'">
              尽快回复，用户已给你留言
            </text>

            <view class="expert" v-if="item?.from == props?.uid">
              <!-- 信息 -->
              <view style="display: flex">
                <image
                  v-if="item?.cloudCustomData != 'isnoline'"
                  :src="
                    props?.avatar ||
                    `https://ossresource.miyingbl.com/uploads/20240522/h-bl-app/1716341858202`
                  "
                  class="img"
                  mode="aspectFill"
                  @click="
                    navigateTo(
                      '/pages-users/my-page/other-index?&uid=' + props?.uid + '&is_self=' + 0,
                    )
                  "
                />
                <view
                  class="text expertText intextcolor"
                  style="background: #fff"
                  v-if="
                    item.type == 'TIMTextElem' &&
                    item?.payload?.text != '请先留言，医生上线后将第一时间回复'
                  "
                >
                  <text>{{ item.payload?.text }}</text>
                </view>
                <view class="text expertText" v-if="item.type == 'TIMImageElem'">
                  <image
                    :src="item.payload.imageInfoArray[0].imageUrl"
                    :style="{ width: item.payload.imageInfoArray[1].width + 'rpx' }"
                    style="max-width: 500rpx; min-width: 200rpx"
                    mode="widthFix"
                    @click="previewImg(item.payload.imageInfoArray[0].imageUrl)"
                    :show-menu-by-longpress="true"
                  ></image>
                </view>
                <view class="text expertText" v-if="item.type == 'TIMVideoFileElem'">
                  <video
                    :id="'myVideo' + index"
                    @play="playing(index)"
                    controls
                    style="height: 30vh; width: 500rpx; border-radius: 16rpx"
                    :src="item.payload?.videoUrl"
                  ></video>
                </view>
                <view
                  class="text sound_box"
                  v-if="item.type == 'TIMSoundElem'"
                  style="margin: 0 16rpx; background: #e8e9e9; line-height: 1"
                  :style="{
                    'padding-right': 26 + +item?.cloudCustomData * 3 + 'rpx',
                  }"
                >
                  <trumpet
                    :isPlay="isplay && onPlay == index && item?.from == props?.uid"
                    @click="audioPlay(item.payload.remoteAudioUrl, index)"
                    :size="20"
                    direction="right"
                  />
                  <view class="sound_num" v-if="item?.cloudCustomData">
                    {{ item?.cloudCustomData }}″
                  </view>
                </view>
                <view class="text person_box" v-if="item?.payload?.data == '1'">
                  <view class="per_heard">
                    <image src="@/static/yunchan/chat/info_card.png" mode="scaleToFill" />
                    <view class="per_title">个人名片</view>
                  </view>
                  <view class="per_info">
                    <view class="per_info_item">
                      <view class="item_left">姓&nbsp&nbsp&nbsp&nbsp&nbsp 名：</view>
                      <view class="item_right" style="font-weight: 600">{{
                        JSON.parse(item?.payload?.extension)?.name
                      }}</view>
                      <view
                        v-if="!JSON.parse(item?.payload?.extension)?.product_date"
                        class="item_right"
                        style="
                          font-family: PingFang SC, PingFang SC;
                          font-weight: 500;
                          font-size: 18rpx;
                          color: #333333;
                          margin-left: 11rpx;
                        "
                      >
                        {{ JSON.parse(item?.payload?.extension)?.tag }}
                      </view>
                    </view>
                    <view
                      class="per_info_item"
                      v-if="!JSON.parse(item?.payload?.extension)?.product_date"
                    >
                      <view class="item_left">预&nbsp&nbsp产&nbsp期：</view>
                      <view class="item_right">{{
                        JSON.parse(item?.payload?.extension)?.due_date
                      }}</view>
                    </view>
                    <view
                      class="per_info_item"
                      v-if="JSON.parse(item?.payload?.extension)?.product_date"
                    >
                      <view class="item_left">生产日期：</view>
                      <view class="item_right">{{
                        JSON.parse(item?.payload?.extension)?.product_date
                      }}</view>
                    </view>
                    <view
                      class="per_info_item"
                      v-if="
                        JSON.parse(item?.payload?.extension)?.baby_sex &&
                        JSON.parse(item?.payload?.extension)?.product_date
                      "
                    >
                      <view class="item_left">宝宝性别：</view>
                      <view
                        class="item_right"
                        v-if="JSON.parse(item?.payload?.extension)?.baby_sex == 0"
                        >未知</view
                      >
                      <view
                        class="item_right"
                        v-else-if="JSON.parse(item?.payload?.extension)?.baby_sex == 1"
                        >小王子</view
                      >
                      <view
                        class="item_right"
                        v-else-if="JSON.parse(item?.payload?.extension)?.baby_sex == 2"
                        >小公主</view
                      >
                      <view class="item_right" v-else>龙凤胎</view>
                    </view>
                    <view class="per_info_item">
                      <view class="item_left">年 &nbsp&nbsp&nbsp&nbsp&nbsp龄：</view>
                      <view class="item_right">{{
                        JSON.parse(item?.payload?.extension)?.age
                      }}</view>
                    </view>
                    <view class="per_info_item">
                      <view class="item_left">身 &nbsp&nbsp&nbsp&nbsp&nbsp高：</view>
                      <view class="item_right"
                        >{{ JSON.parse(item?.payload?.extension)?.height }}cm</view
                      >
                    </view>
                    <view class="per_info_item">
                      <view class="item_left">体 &nbsp&nbsp&nbsp&nbsp&nbsp重：</view>
                      <view class="item_right"
                        >{{ JSON.parse(item?.payload?.extension)?.conceive_weight }}kg</view
                      >
                    </view>
                  </view>
                </view>
                <view
                  class="text shop_box"
                  @click="gotoShop(item)"
                  v-if="item?.payload?.data == '2'"
                >
                  <view class="img_box">
                    <image :src="JSON.parse(item?.payload?.extension)?.image" mode="scaleToFill" />
                  </view>
                  <view class="shop_info_box">
                    <view class="shop_info_title">{{
                      JSON.parse(item?.payload?.extension)?.store_name
                    }}</view>
                    <view class="shop_info_price">
                      <view class="price">
                        <text class="price_icon">￥</text>
                        <text class="price_num">
                          {{ parseFloat(Number(JSON.parse(item?.payload?.extension)?.price)) }}
                        </text>
                      </view>
                      <view
                        class="und_price"
                        v-if="
                          parseFloat(Number(JSON.parse(item?.payload?.extension)?.ot_price)) != 0
                        "
                      >
                        ￥{{
                          parseFloat(Number(JSON.parse(item?.payload?.extension)?.ot_price))
                        }}</view
                      >
                    </view>
                  </view>
                </view>
                <view class="text cj_box" v-if="item?.payload?.data == '3'">
                  <view class="cj_list">
                    <view class="cj_title">产检记录</view>
                    <view
                      class="cj_item"
                      v-for="(cj, index) of JSON.parse(item?.payload?.extension)"
                      :key="index"
                      @click="
                        navigateTo(
                          cj.status != 1
                            ? `/pregnancys/index/time-table/record-detail?id=${cj?.id}&isshow=false&uid=${props?.uid}`
                            : `/pregnancys/index/chat-look-record?id=${cj?.id}&uid=${props?.uid}`,
                        )
                      "
                      v-show="index < (isTwoOrThree(JSON.parse(item?.payload?.extension)) ? 2 : 3)"
                    >
                      <view class="cj_item_left">
                        <view class="noready">
                          <view class="noready_text">
                            <view class="cj_item_title">{{ cj?.name }}</view>
                            <view
                              class="cj_item_xm u-line-1"
                              :class="{ 'u-line-2': cj?.status == 1, 'u-line-1': cj?.status != 1 }"
                              v-if="cj?.bcxm_cate?.length"
                            >
                              必查项目：
                              <text v-for="(t, index) of cj?.bcxm_cate" :key="index">
                                {{ t }}
                                {{
                                  cj?.user_cate?.length - 1 != index && cj?.user_cate?.length > 1
                                    ? '、'
                                    : ''
                                }}
                              </text>
                            </view>
                            <view
                              class="cj_item_xm u-line-1"
                              :class="{ 'u-line-2': cj?.status == 1, 'u-line-1': cj?.status != 1 }"
                              v-else
                            >
                              必查项目：
                              <text v-for="(t, index) of cj?.user_cate" :key="index">
                                {{ t.name }}
                                <text
                                  v-show="
                                    cj?.user_cate?.length - 1 != index && cj?.user_cate?.length > 1
                                  "
                                  >、
                                </text>
                              </text>
                            </view>
                          </view>
                          <view
                            class="cj_item_right"
                            v-if="cj?.user_cate?.length != 1 && cj?.status != 1"
                          >
                            <image src="@/static/yunchan/chat/right.png" mode="scaleToFill" />
                          </view>
                        </view>
                        <view class="ready_image">
                          <view class="cj_img_box" v-if="cj?.cj_report?.[0]?.includes('https')">
                            <view
                              v-for="(cjimg, index) of cj?.cj_report"
                              v-show="index < 1"
                              :key="index"
                              class="cj_item_img"
                            >
                              <image :src="cjimg" mode="scaleToFill" />
                            </view>
                          </view>
                          <view
                            class="cj_item_right"
                            v-if="cj?.user_cate?.length != 1 && cj?.status == 1"
                          >
                            <image src="@/static/yunchan/chat/right.png" mode="scaleToFill" />
                          </view>
                        </view>
                      </view>
                      <h-line
                        v-show="JSON.parse(item?.payload?.extension)?.data?.length - 1 != index"
                        style="margin: 20rpx"
                        height="1"
                        bgColor="#EEEEEE"
                      >
                      </h-line>
                    </view>

                    <view
                      class="find_all"
                      @click="
                        navigateTo(
                          `/pregnancys/index/chat-record-test?ids=${getids(
                            JSON.parse(item?.payload?.extension),
                          )}&uid=${props?.uid}`,
                        )
                      "
                      v-if="
                        (JSON.parse(item?.payload?.extension)?.length > 1 &&
                          JSON.parse(item?.payload?.extension)?.[0]?.status == 0) ||
                        (JSON.parse(item?.payload?.extension)?.length > 1 &&
                          JSON.parse(item?.payload?.extension)?.[0]?.status == 2)
                      "
                    >
                      查看全部
                    </view>
                    <view
                      v-else-if="
                        JSON.parse(item?.payload?.extension)?.[0]?.status == 0 ||
                        JSON.parse(item?.payload?.extension)?.[0]?.status == 2
                      "
                      class="find_detail"
                      @click="
                        navigateTo(
                          `/pregnancys/index/time-table/record-detail?id=${
                            JSON.parse(item?.payload?.extension)?.[0]?.id
                          }&isshow=${false}&uid=${props?.uid}`,
                        )
                      "
                    >
                      查看详情
                    </view>
                    <view
                      @click="
                        navigateTo(
                          `/pregnancys/index/chat-record-test?ids=${getids(
                            JSON.parse(item?.payload?.extension),
                          )}&uid=${props?.uid}`,
                        )
                      "
                      v-else-if="
                        JSON.parse(item?.payload?.extension)?.[0]?.status == 1 &&
                        JSON.parse(item?.payload?.extension)?.length > 1
                      "
                      class="find_detail1"
                    >
                      查看全部
                    </view>
                    <view
                      @click="
                        navigateTo(
                          `/pregnancys/index/chat-look-record?id=${
                            JSON.parse(item?.payload?.extension)?.[0]?.id
                          }&uid=${props?.uid}`,
                        )
                      "
                      v-else
                      class="find_detail1"
                    >
                      查看详情
                    </view>
                  </view>
                </view>
                <navigator
                  :url="`/pregnancys/weight-management/weight-record?isshow=${false}&day=1&uid=${
                    props?.uid
                  }`"
                  open-type="navigate"
                  hover-class="none"
                  class="text weight_box"
                  v-if="item?.payload?.data == '4' && props?.chat_type == 1"
                >
                  <view class="weight_title">体重记录</view>
                  <view class="weight_time">
                    {{ JSON.parse(item?.payload?.extension)?.[0]?.time }} &nbsp更新
                  </view>
                  <view class="weight_add">
                    比孕前体重{{ JSON.parse(item?.payload?.extension)?.weight }}kg
                    {{ JSON.parse(item?.payload?.extension)?.[0]?.diff_weight }}
                  </view>
                  <view class="weight_now">
                    当前体重
                    <text style="font-size: 34rpx">
                      {{ JSON.parse(item?.payload?.extension)?.[0]?.num }}kg
                    </text>
                  </view>
                  <h-line style="margin-bottom: 20rpx" height="1" bgColor="#EEEEEE"></h-line>
                  <view style="align-self: flex-end" class="find_detail">查看详情</view>
                </navigator>
                <navigator
                  :url="`/pediatrics/weightManagement/record?childId=${
                    babydetail?.id
                  }&isshow=${false}`"
                  open-type="navigate"
                  hover-class="none"
                  class="text weight_box"
                  v-if="item?.payload?.data == '4' && props?.chat_type == 3"
                >
                  <view class="weight_title">体重记录</view>
                  <view class="weight_time">
                    {{ JSON.parse(item?.payload?.extension)?.[0]?.time }} &nbsp更新
                  </view>
                  <view class="weight_add">
                    比昨日体重{{ JSON.parse(item?.payload?.extension)?.[0]?.before_weight }}kg
                    {{ JSON.parse(item?.payload?.extension)?.[0]?.diff_weight }}
                  </view>
                  <view class="weight_now">
                    当前体重
                    <text style="font-size: 34rpx">
                      {{ JSON.parse(item?.payload?.extension)?.[0]?.num }}kg
                    </text>
                  </view>
                  <h-line style="margin-bottom: 20rpx" height="1" bgColor="#EEEEEE"></h-line>
                  <view class="find_detail">查看详情</view>
                </navigator>
                <view class="text eat_box" v-if="item?.payload?.data == '5'">
                  <view class="eat_title">饮食记录</view>
                  <view class="eat_time">
                    {{
                      JSON.parse(item?.payload?.extension)?.today
                        ? `${JSON.parse(item?.payload?.extension)?.today}&nbsp`
                        : ''
                    }}
                    {{ JSON.parse(item?.payload?.extension)?.date }}
                  </view>
                  <view class="eat_list">
                    <view
                      class="eat_item"
                      v-for="(fitem, index) of JSON.parse(item?.payload?.extension)?.data"
                      :key="index"
                    >
                      <view class="eat_food" v-if="fitem?.data?.length">
                        <view class="eat_food_left">{{ fitem.meal }}：</view>
                        <view class="eat_food_right">
                          <view
                            class="eat_food_item"
                            v-for="(i, index) of fitem?.data"
                            :key="index"
                          >
                            {{ i }}
                          </view>
                        </view>
                      </view>
                      <h-line
                        v-show="
                          JSON.parse(item?.payload?.extension)?.data.length - 1 != index &&
                          item?.payload?.description == 1 &&
                          fitem?.data?.length
                        "
                        style="margin: 20rpx 0"
                        height="1"
                        bgColor="#EEEEEE"
                      ></h-line>
                      <h-line
                        v-show="item?.payload?.description != 1 && fitem?.data?.length"
                        style="margin: 20rpx 0"
                        height="1"
                        bgColor="#EEEEEE"
                      ></h-line>
                    </view>
                  </view>
                  <!-- <navigator
                :url="`/pregnancy/weight-management/diet-record/foods-and-sport?isshow=${false}&day=1`"
                open-type="navigate"
                hover-class="none"
                class="find_detail"
                v-if="item?.payload?.description == 1"
              >
                查看详情
              </navigator> -->
                  <view
                    style="align-self: flex-end"
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-if="item?.payload?.description == 7"
                  >
                    近{{ item?.payload?.description }}天饮食记录
                  </view>
                  <view
                    style="align-self: flex-end"
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-else-if="item?.payload?.description == 14"
                  >
                    近{{ item?.payload?.description }}天饮食记录
                  </view>
                  <view
                    style="align-self: flex-end"
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-else-if="item?.payload?.description == 30"
                  >
                    近{{ item?.payload?.description }}天饮食记录
                  </view>
                  <view
                    style="align-self: flex-end"
                    class="find_more"
                    @click="
                      gotosleep('', item?.payload?.data, JSON.parse(item?.payload?.extension))
                    "
                    v-else-if="item?.payload?.description == 'all'"
                  >
                    全部饮食记录
                  </view>
                </view>
                <view class="text sport_box" v-if="item?.payload?.data == '6'">
                  <view class="sport_title">运动记录</view>
                  <view class="sport_time">
                    {{
                      JSON.parse(item?.payload?.extension)?.today
                        ? `${JSON.parse(item?.payload?.extension)?.today}&nbsp`
                        : ''
                    }}
                    {{ JSON.parse(item?.payload?.extension)?.date }}
                  </view>
                  <view
                    class="sport_obj"
                    v-for="(sitem, index) of JSON.parse(item?.payload?.extension)?.data"
                    :key="index"
                  >
                    运动名称：{{ sitem.name }}
                  </view>

                  <h-line
                    v-if="item?.payload?.description != 1"
                    style="margin-bottom: 20rpx"
                    height="1"
                    bgColor="#EEEEEE"
                  ></h-line>

                  <!-- <navigator
                :url="`/pregnancy/weight-management/diet-record/foods-and-sport?isshow=${false}&day=1`"
                open-type="navigate"
                hover-class="none"
                class="find_detail"
                v-if="item?.payload?.description == 1"
              >
                查看详情
              </navigator> -->
                  <view
                    style="align-self: flex-end"
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-if="item?.payload?.description == 7"
                  >
                    近{{ item?.payload?.description }}天运动记录
                  </view>
                  <view
                    style="align-self: flex-end"
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-else-if="item?.payload?.description == 14"
                  >
                    近{{ item?.payload?.description }}天运动记录
                  </view>
                  <view
                    style="align-self: flex-end"
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-else-if="item?.payload?.description == 30"
                  >
                    近{{ item?.payload?.description }}天运动记录
                  </view>
                  <view
                    style="align-self: flex-end"
                    @click="
                      gotosleep('', item?.payload?.data, JSON.parse(item?.payload?.extension))
                    "
                    class="find_more"
                    v-else-if="item?.payload?.description == 'all'"
                  >
                    全部运动记录
                  </view>
                </view>
                <view class="text sleep_box" v-if="item?.payload?.data == '7'">
                  <view class="sleep_title">睡眠记录</view>
                  <view class="sleep_time">
                    {{
                      JSON.parse(item?.payload?.extension)?.today
                        ? `${JSON.parse(item?.payload?.extension)?.today}&nbsp`
                        : ''
                    }}
                    {{ JSON.parse(item?.payload?.extension)?.date }}
                  </view>
                  <view class="sleep_list">
                    <view
                      class="sleep_item"
                      v-for="(slitem, index) of JSON.parse(item?.payload?.extension)?.data"
                      :key="index"
                    >
                      <view class="sleep_top">
                        <view class="sleep_item_left">
                          <image
                            v-if="slitem?.type == 2"
                            src="@/static/yunchan/chat/sun.png"
                            mode="scaleToFill"
                          />
                          <image v-else src="@/static/yunchan/chat/moon.png" mode="scaleToFill" />
                        </view>
                        <view
                          v-if="slitem?.type == 2"
                          style="margin: 0 86rpx 0 10rpx"
                          class="sleep_item_middle"
                        >
                          小憩
                        </view>
                        <view v-else style="margin: 0 30rpx 0 10rpx" class="sleep_item_middle">
                          夜间睡眠
                        </view>
                        <view
                          class="sleep_item_right"
                          :style="{ background: props.chat_type == 3 ? '#F6F6F6' : '#ede9ff' }"
                        >
                          <view class="sleep_item_right_top">{{ slitem?.hour }} 小时</view>
                          <view class="sleep_item_right_btm">
                            {{ slitem?.start_time }}—{{ slitem?.end_time }}
                          </view>
                        </view>
                      </view>
                      <h-line
                        v-show="JSON.parse(item?.payload?.extension)?.data?.length - 1 != index"
                        style="margin-bottom: 15rpx"
                        height="1"
                        bgColor="#EEEEEE"
                      >
                      </h-line>
                    </view>
                  </view>
                  <!-- <navigator
                :url="`/pregnancy/weight-management/sleep-record/index?isshow=${false}&day=1&date=${optionsDate}`"
                open-type="navigate"
                hover-class="none"
                class="find_detail"
                v-if="item?.payload?.description == 1"
              >
                查看详情
              </navigator> -->
                  <view
                    style="align-self: flex-end"
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-if="item?.payload?.description == 7"
                  >
                    近{{ item?.payload?.description }}天睡眠记录
                  </view>
                  <view
                    style="align-self: flex-end"
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-else-if="item?.payload?.description == 14"
                  >
                    近{{ item?.payload?.description }}天睡眠记录
                  </view>
                  <view
                    style="align-self: flex-end"
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-else-if="item?.payload?.description == 30"
                  >
                    近{{ item?.payload?.description }}天睡眠记录
                  </view>
                  <view
                    style="align-self: flex-end"
                    class="find_more"
                    @click="
                      gotosleep('', item?.payload?.data, JSON.parse(item?.payload?.extension))
                    "
                    v-else-if="item?.payload?.description == 'all'"
                  >
                    全部睡眠记录
                  </view>
                </view>
                <view
                  class="text article_box"
                  @click="gotoShop(item)"
                  v-if="item?.payload?.data == '8'"
                >
                  <view class="article_title u-line-2">
                    {{ JSON.parse(item?.payload?.extension)?.title }}
                  </view>
                  <view class="content_box">
                    <view class="content_box_text u-line-3">
                      {{ extractTextFromRichText(JSON.parse(item?.payload?.extension)?.content) }}
                    </view>
                    <view class="content_box_image">
                      <image
                        :src="JSON.parse(item?.payload?.extension)?.image?.[0]"
                        mode="aspectFill"
                      />
                    </view>
                  </view>
                  <h-line
                    style="margin-bottom: 10rpx; margin-top: 20rpx"
                    height="1"
                    bgColor="#EEEEEE"
                  >
                  </h-line>
                  <view class="tag_box">
                    <view class="tag_box_img">
                      <image src="@/static/yunchan/chat/chat_logo.png" mode="aspectFill" />
                    </view>
                    <view class="tag_box_text"> 咪婴伴侣 </view>
                  </view>
                </view>
                <view
                  class="text baby_info_box"
                  v-if="item?.payload?.data == '9' && item?.payload?.extension?.length"
                >
                  <view class="per_heard"> {{ JSON.parse(item?.payload?.extension)?.name }} </view>
                  <view class="per_info">
                    <view class="per_info_item">
                      <view class="item_left">宝宝性别 ：</view>
                      <view class="item_right">
                        {{ JSON.parse(item?.payload?.extension)?.baby_sex == 1 ? '男' : '女' }}
                      </view>
                    </view>
                    <view
                      class="per_info_item"
                      v-if="JSON.parse(item?.payload?.extension)?.age_text"
                    >
                      <view class="item_left">宝宝年龄 ：</view>
                      <view class="item_right">{{
                        JSON.parse(item?.payload?.extension)?.age_text
                      }}</view>
                    </view>
                    <view
                      class="per_info_item"
                      v-if="JSON.parse(item?.payload?.extension)?.birthday"
                    >
                      <view class="item_left">出生日期 ：</view>
                      <view class="item_right">
                        {{ JSON.parse(item?.payload?.extension)?.birthday }}
                      </view>
                    </view>
                    <view
                      class="per_info_item"
                      v-if="
                        JSON.parse(item?.payload?.extension)?.length &&
                        JSON.parse(item?.payload?.extension)?.age < 7
                      "
                    >
                      <view class="item_left">宝宝身高 ：</view>
                      <view class="item_right">
                        {{ JSON.parse(item?.payload?.extension)?.length }}
                      </view>
                    </view>
                    <view
                      class="per_info_item"
                      v-if="
                        JSON.parse(item?.payload?.extension)?.weight &&
                        JSON.parse(item?.payload?.extension)?.age < 7
                      "
                    >
                      <view class="item_left">宝宝体重 ：</view>
                      <view class="item_right">
                        {{ JSON.parse(item?.payload?.extension)?.weight }}
                      </view>
                    </view>
                    <view
                      class="per_info_item"
                      v-if="
                        JSON.parse(item?.payload?.extension)?.head_circumference &&
                        JSON.parse(item?.payload?.extension)?.age < 7
                      "
                    >
                      <view class="item_left">宝宝头围 ：</view>
                      <view class="item_right">
                        {{ JSON.parse(item?.payload?.extension)?.head_circumference }}
                      </view>
                    </view>
                  </view>
                </view>
                <view
                  class="text vaccine_box"
                  v-if="item?.payload?.data == '10' && item?.payload?.extension"
                >
                  <view class="cj_list">
                    <view class="cj_title">疫苗记录</view>
                    <view
                      class="cj_item"
                      v-for="(cj, index) of JSON.parse(item?.payload?.extension).data"
                      :key="index"
                      v-show="
                        index < (isTwoOrThree(JSON.parse(item?.payload?.extension).data) ? 2 : 3)
                      "
                    >
                      <view class="cj_item_left">
                        <view class="noready">
                          <view class="noready_text">
                            <view class="vaccine_header">
                              <view class="cj_item_title">{{ cj?.vaccine_config_name }} </view>
                              <view class="vaccine_tag" v-if="cj?.inoculability_type == 0">
                                免费
                              </view>
                              <view
                                class="vaccine_tag"
                                v-else-if="cj?.inoculability_type == 1"
                                style="background-color: #de272a; color: #fff"
                              >
                                自费
                              </view>
                              <view
                                class="vaccine_tag"
                                v-else
                                style="background-color: #40b7cb; color: #fff"
                              >
                                新增
                              </view>
                              <view class="vaccine_tag">
                                第{{ cj?.doses }}/{{ cj?.vaccine_config_total_doses }}针
                              </view>
                            </view>
                            <view class="cj_item_xm u-line-1">
                              <text>{{ cj?.vaccine_config_disease }} </text>
                            </view>
                            <view class="practical_item_xm u-line-1" v-if="cj?.inoculability_time">
                              实际接种时间：
                              <text> {{ cj?.inoculability_time }}</text>
                            </view>
                          </view>
                        </view>
                      </view>
                      <h-line
                        v-show="JSON.parse(item?.payload?.extension)?.data?.length - 1 != index"
                        style="margin: 20rpx"
                        height="1"
                        bgColor="#EEEEEE"
                      >
                      </h-line>
                    </view>
                    <view
                      class="find_all"
                      :style="{
                        'margin-top':
                          JSON.parse(item?.payload?.extension)?.data?.length >= 3 ? '0' : '20rpx',
                      }"
                      @click="
                        navigateTo(
                          `/pediatrics/vaccination/records?userId=${
                            props?.uid
                          }&isshow=${false}&ids=${getids(
                            JSON.parse(item?.payload?.extension)?.data,
                          )}&childId=${
                            JSON.parse(item?.payload?.extension).child_id || babydetail.id
                          }`,
                        )
                      "
                      v-if="JSON.parse(item?.payload?.extension)?.data?.length > 1"
                    >
                      查看全部
                    </view>
                    <view
                      v-else-if="
                        JSON.parse(item?.payload?.extension)?.data?.[0]?.inoculability_type == 1
                      "
                      style="margin-top: 20rpx"
                      class="find_detail"
                      @click="
                        navigateTo(
                          `/pediatrics/vaccination/records?userId=${
                            props?.uid
                          }&isshow=${false}&id=${
                            JSON.parse(item?.payload?.extension)?.data?.[0]
                              ?.vaccine_config_details_id
                          }&childId=${
                            JSON.parse(item?.payload?.extension).child_id || babydetail.id
                          }`,
                        )
                      "
                    >
                      查看详情
                    </view>
                    <view
                      v-else
                      style="margin-top: 20rpx"
                      class="find_detail"
                      @click="
                        navigateTo(
                          `/pediatrics/vaccination/selfVaccineDetail?userId=${
                            props?.uid
                          }&isshow=${false}&id=${
                            JSON.parse(item?.payload?.extension)?.data?.[0]
                              ?.vaccine_config_details_id
                          }&childId=${
                            JSON.parse(item?.payload?.extension).child_id || babydetail.id
                          }`,
                        )
                      "
                    >
                      查看详情
                    </view>
                  </view>
                </view>
                <view
                  class="text feed_box"
                  v-if="item?.payload?.data == '11' && item?.payload?.extension?.length"
                >
                  <view class="feed_header">
                    <view class="feed_header_title">喂养记录</view>
                    <view class="feed_header_time">
                      {{ JSON.parse(item?.payload?.extension).date }}
                    </view>
                  </view>
                  <view
                    class="feed_list"
                    v-show="index < 3"
                    v-for="(im, index) of isdetail(JSON.parse(item?.payload?.extension))"
                  >
                    <view class="feed_item">
                      <view class="feed_item_feedtype">
                        <view class="feed_item_feed_title">
                          {{ im?.name }}
                        </view>
                        <view class="feed_item_feed_time">
                          {{ im?.duration }}
                        </view>
                      </view>
                      <view class="feed_item_time">
                        {{ im?.hour_minute }}
                      </view>
                    </view>
                  </view>
                  <view
                    v-if="isdetail(JSON.parse(item?.payload?.extension))"
                    class="find_all"
                    @click="
                      navigateTo(
                        `/pediatrics/feedingRecord/index?userId=${
                          props?.uid
                        }&isshow=${false}&childId=${babydetail.id}`,
                      )
                    "
                  >
                    查看全部
                  </view>
                </view>
                <view
                  class="text grow_box"
                  v-if="item?.payload?.data == '12' && item?.payload?.extension?.length"
                >
                  <view class="feed_header">
                    <view class="feed_header_title">生长记录</view>
                    <view class="feed_header_time">{{
                      JSON.parse(item?.payload?.extension)?.date
                    }}</view>
                  </view>
                  <view class="feed_list">
                    <view
                      class="feed_item"
                      v-if="JSON.parse(item?.payload?.extension)?.head_circumference"
                    >
                      <view class="feed_item_feedtype">
                        <view class="feed_item_feed_title"> 头围 </view>
                        <view class="feed_item_feed_time">
                          {{ JSON.parse(item?.payload?.extension)?.head_circumference?.num + 'cm' }}
                        </view>
                      </view>
                      <view class="feed_item_time">
                        {{ JSON.parse(item?.payload?.extension)?.head_circumference?.hour_minute }}
                      </view>
                    </view>
                    <view class="feed_item" v-if="JSON.parse(item?.payload?.extension)?.jaundice">
                      <view class="feed_item_feedtype">
                        <view class="feed_item_feed_title"> 黄疸 </view>
                        <view class="feed_item_feed_time">
                          {{ JSON.parse(item?.payload?.extension)?.jaundice?.num + 'ml' }}
                        </view>
                      </view>
                      <view class="feed_item_time">
                        {{ JSON.parse(item?.payload?.extension)?.jaundice?.hour_minute }}
                      </view>
                    </view>
                    <view class="feed_item" v-if="JSON.parse(item?.payload?.extension)?.height">
                      <view class="feed_item_feedtype">
                        <view class="feed_item_feed_title"> 身高 </view>
                        <view class="feed_item_feed_time">
                          {{ JSON.parse(item?.payload?.extension)?.height?.num + 'cm' }}
                        </view>
                      </view>
                      <view class="feed_item_time">
                        {{ JSON.parse(item?.payload?.extension)?.height?.hour_minute }}
                      </view>
                    </view>
                    <view class="feed_item" v-if="JSON.parse(item?.payload?.extension)?.weight">
                      <view class="feed_item_feedtype">
                        <view class="feed_item_feed_title"> 体重 </view>
                        <view class="feed_item_feed_time">
                          {{ JSON.parse(item?.payload?.extension)?.weight?.num + 'kg' }}
                        </view>
                      </view>
                      <view class="feed_item_time">
                        {{ JSON.parse(item?.payload?.extension)?.weight?.hour_minute }}
                      </view>
                    </view>
                  </view>
                  <view
                    class="find_all"
                    @click="
                      navigateTo(
                        `/pediatrics/growthRecord/index?userId=${
                          props?.uid
                        }&isshow=${false}&childId=${babydetail.id}`,
                      )
                    "
                  >
                    查看全部
                  </view>
                </view>
                <view
                  class="text health_BOX"
                  v-if="item?.payload?.data == '13' && item?.payload?.extension?.length"
                >
                  <view class="health_title">健康数据</view>
                  <view class="health_body">
                    <view class="health_name1">
                      <view>姓名：</view>
                      <view class=""> {{ JSON.parse(item?.payload?.extension)?.name }} </view>
                    </view>
                    <view class="health_mid">
                      <view class="health_name" style="margin-right: 130rpx">
                        <view>姓别：</view>
                        <view class=""> {{ JSON.parse(item?.payload?.extension)?.gender }} </view>
                      </view>
                      <view class="health_name">
                        <view>年龄：</view>
                        <view class=""> {{ JSON.parse(item?.payload?.extension)?.age }} </view>
                      </view>
                    </view>
                    <view class="health_kg">
                      <view class="health_name" style="margin-right: 72rpx">
                        <view>身高：</view>
                        <view class=""> {{ JSON.parse(item?.payload?.extension)?.height }} </view>
                      </view>
                      <view class="health_name">
                        <view>体重：</view>
                        <view class=""> {{ JSON.parse(item?.payload?.extension)?.weight }} </view>
                      </view>
                    </view>
                    <view
                      class="find_detail_health"
                      @click="
                        navigateTo(`/patients/info/manIndex?userId=${props?.uid}&isshow=false`)
                      "
                    >
                      点击查看更多
                    </view>
                  </view>
                </view>
                <view
                  class="text mandata_BOX"
                  v-if="item?.payload?.data == '14' && item?.payload?.extension?.length"
                >
                  <view
                    class="mandata_title"
                    style="
                      background: linear-gradient(
                        180deg,
                        rgba(79, 229, 223, 0.5) 0%,
                        rgba(79, 229, 223, 0.1) 100%
                      );
                    "
                  >
                    <text class="block_text" style="margin-right: 20rpx">
                      {{ JSON.parse(item?.payload?.extension)?.sex == 2 ? '男' : '' }}
                    </text>
                    <text class="block_text">
                      {{ JSON.parse(item?.payload?.extension)?.age + '岁' }}
                    </text>
                  </view>
                  <view class="mandata_body">
                    <view class="mandata_object">
                      <text class="block_text">类型：</text>
                      <text>{{ JSON.parse(item?.payload?.extension)?.describe }}</text>
                    </view>
                    <h-line style="margin: 20rpx 0" height="1" bgColor="#EEEEEE"> </h-line>
                    <view
                      class="mandata_object"
                      style="flex-direction: column; margin-bottom: 41rpx"
                    >
                      <text style="margin-bottom: 10rpx" class="block_text">主诉：</text>
                      <text class="block_text ellipsis4" style="font-weight: 400">
                        {{ JSON.parse(item?.payload?.extension)?.content }}
                      </text>
                    </view>
                    <view
                      class="mandata_object"
                      style="flex-direction: column"
                      v-if="JSON.parse(item?.payload?.extension)?.report_image.length"
                    >
                      <text style="margin-bottom: 10rpx" class="block_text">检查报告：</text>
                      <view class="mandata_img_box">
                        <image
                          :src="is"
                          mode="scaleToFill"
                          :key="is"
                          @click="previewImg(is)"
                          v-for="is of JSON.parse(item?.payload?.extension)?.report_image"
                        />
                      </view>
                    </view>
                  </view>
                </view>
              </view>
            </view>
            <view class="user" v-if="item?.from != props?.uid">
              <!-- 时间 -->
              <view class="user_info_msg_box" style="display: flex">
                <view
                  class="text expertText outtextcolor"
                  v-if="
                    item.type == 'TIMTextElem' &&
                    item?.payload?.text != '请先留言，医生上线后将第一时间回复'
                  "
                >
                  <text>{{ item?.payload?.text }}</text>
                </view>

                <view
                  class="text expertText img_box"
                  style="padding: 0"
                  v-if="item?.type == 'TIMImageElem'"
                >
                  <image
                    :src="item.payload.imageInfoArray[0].imageUrl"
                    :style="{ width: item.payload.imageInfoArray[1].width + 'rpx' }"
                    style="max-width: 500rpx; min-width: 200rpx"
                    mode="widthFix"
                    @click="previewImg(item.payload.imageInfoArray[0].imageUrl)"
                    :show-menu-by-longpress="true"
                  ></image>
                </view>
                <view class="text expertText" v-if="item.type == 'TIMVideoFileElem'">
                  <video
                    :id="'myVideo' + index"
                    @play="playing(index)"
                    controls
                    style="height: 30vh; width: 500rpx; border-radius: 16rpx"
                    :src="item?.payload?.videoUrl"
                  ></video>
                </view>
                <view
                  class="text sound_box"
                  v-if="item?.type == 'TIMSoundElem'"
                  style="margin: 0 16rpx; background: #e8e9e9; line-height: 1"
                  :style="{
                    'padding-left': 26 + +item?.cloudCustomData * 3 + 'rpx',
                  }"
                >
                  <view class="sound_num" v-if="item?.cloudCustomData"
                    >{{ item?.cloudCustomData }}″</view
                  >
                  <trumpet
                    :isPlay="isplay && onPlay == index && item?.from != props?.uid"
                    @click="audioPlay(item.payload.remoteAudioUrl, index)"
                    :size="20"
                    direction="left"
                  />
                </view>
                <view class="text person_box" v-if="item?.payload?.data == '1'">
                  <view class="per_heard">
                    <image src="@/static/yunchan/chat/info_card.png" mode="scaleToFill" />
                    <view class="per_title">个人名片</view>
                  </view>
                  <view class="per_info">
                    <view class="per_info_item">
                      <view class="item_left">姓&nbsp&nbsp&nbsp&nbsp&nbsp 名：</view>
                      <view class="item_right" style="font-weight: 600">{{
                        JSON.parse(item?.payload?.extension)?.name
                      }}</view>
                      <view
                        v-if="!JSON.parse(item?.payload?.extension)?.product_date"
                        class="item_right"
                        style="
                          font-family: PingFang SC, PingFang SC;
                          font-weight: 500;
                          font-size: 18rpx;
                          color: #333333;
                          margin-left: 11rpx;
                        "
                      >
                        {{ JSON.parse(item?.payload?.extension)?.tag }}
                      </view>
                    </view>
                    <view
                      class="per_info_item"
                      v-if="!JSON.parse(item?.payload?.extension)?.product_date"
                    >
                      <view class="item_left">预&nbsp&nbsp产&nbsp期：</view>
                      <view class="item_right">{{
                        JSON.parse(item?.payload?.extension)?.due_date
                      }}</view>
                    </view>
                    <view
                      class="per_info_item"
                      v-if="JSON.parse(item?.payload?.extension)?.product_date"
                    >
                      <view class="item_left">生产日期：</view>
                      <view class="item_right">{{
                        JSON.parse(item?.payload?.extension)?.product_date
                      }}</view>
                    </view>
                    <view
                      class="per_info_item"
                      v-if="
                        JSON.parse(item?.payload?.extension)?.baby_sex &&
                        JSON.parse(item?.payload?.extension)?.product_date
                      "
                    >
                      <view class="item_left">宝宝性别：</view>
                      <view
                        class="item_right"
                        v-if="JSON.parse(item?.payload?.extension)?.baby_sex == 0"
                        >未知</view
                      >
                      <view
                        class="item_right"
                        v-else-if="JSON.parse(item?.payload?.extension)?.baby_sex == 1"
                        >小王子</view
                      >
                      <view
                        class="item_right"
                        v-else-if="JSON.parse(item?.payload?.extension)?.baby_sex == 2"
                        >小公主</view
                      >
                      <view class="item_right" v-else>龙凤胎</view>
                    </view>
                    <view class="per_info_item">
                      <view class="item_left">年 &nbsp&nbsp&nbsp&nbsp&nbsp龄：</view>
                      <view class="item_right">{{
                        JSON.parse(item?.payload?.extension)?.age
                      }}</view>
                    </view>
                    <view class="per_info_item">
                      <view class="item_left">身 &nbsp&nbsp&nbsp&nbsp&nbsp高：</view>
                      <view class="item_right"
                        >{{ JSON.parse(item?.payload?.extension)?.height }}cm</view
                      >
                    </view>
                    <view class="per_info_item">
                      <view class="item_left">体 &nbsp&nbsp&nbsp&nbsp&nbsp重：</view>
                      <view class="item_right"
                        >{{ JSON.parse(item?.payload?.extension)?.conceive_weight }}kg</view
                      >
                    </view>
                  </view>
                </view>
                <view
                  class="text shop_box"
                  @click.stop="gotoShop(item)"
                  v-if="item?.payload?.data == '2'"
                >
                  <view class="img_box">
                    <image :src="JSON.parse(item?.payload?.extension)?.image" mode="scaleToFill" />
                  </view>
                  <view class="shop_info_box">
                    <view class="shop_info_title">{{
                      JSON.parse(item?.payload?.extension)?.store_name
                    }}</view>
                    <view class="shop_info_price">
                      <view class="price">
                        <text class="price_icon">￥</text>
                        <text class="price_num">
                          {{ parseFloat(Number(JSON.parse(item?.payload?.extension)?.price)) }}
                        </text>
                      </view>
                      <view
                        class="und_price"
                        v-if="
                          parseFloat(Number(JSON.parse(item?.payload?.extension)?.ot_price)) != 0
                        "
                      >
                        ￥{{ parseFloat(Number(JSON.parse(item?.payload?.extension)?.ot_price)) }}
                      </view>
                    </view>
                  </view>
                </view>
                <view class="text cj_box" v-if="item?.payload?.data == '3'">
                  <view class="cj_list">
                    <view class="cj_title">产检记录</view>
                    <view
                      class="cj_item"
                      v-for="(cj, index) of JSON.parse(item?.payload?.extension)"
                      :key="index"
                      @click="
                        navigateTo(
                          cj.status != 1
                            ? `/pregnancys/index/time-table/record-detail?id=${cj?.id}&isshow=false&uid=${props?.uid}`
                            : `/pregnancys/index/chat-look-record?id=${cj?.id}&uid=${props?.uid}`,
                        )
                      "
                      v-show="index < (isTwoOrThree(JSON.parse(item?.payload?.extension)) ? 2 : 3)"
                    >
                      <view class="cj_item_left">
                        <view class="noready">
                          <view class="noready_text">
                            <view class="cj_item_title">{{ cj?.name }}</view>
                            <view
                              class="cj_item_xm u-line-1"
                              :class="{ 'u-line-2': cj?.status == 1, 'u-line-1': cj?.status != 1 }"
                              v-if="cj?.bcxm_cate?.length"
                            >
                              必查项目：
                              <text v-for="(t, index) of cj?.bcxm_cate" :key="index">
                                {{ t }}
                                {{
                                  cj?.user_cate?.length - 1 != index && cj?.user_cate?.length > 1
                                    ? '、'
                                    : ''
                                }}
                              </text>
                            </view>
                            <view
                              class="cj_item_xm u-line-1"
                              :class="{ 'u-line-2': cj?.status == 1, 'u-line-1': cj?.status != 1 }"
                              v-else
                            >
                              必查项目：
                              <text v-for="(t, index) of cj?.user_cate" :key="index">
                                {{ t.name }}
                                <text
                                  v-show="
                                    cj?.user_cate?.length - 1 != index && cj?.user_cate?.length > 1
                                  "
                                  >、
                                </text>
                              </text>
                            </view>
                          </view>
                          <view
                            class="cj_item_right"
                            v-if="cj?.user_cate?.length != 1 && cj?.status != 1"
                          >
                            <image src="@/static/yunchan/chat/right.png" mode="scaleToFill" />
                          </view>
                        </view>
                        <view class="ready_image">
                          <view class="cj_img_box" v-if="cj?.cj_report?.[0]?.includes('https')">
                            <view
                              v-for="(cjimg, index) of cj?.cj_report"
                              v-show="index < 1"
                              :key="index"
                              class="cj_item_img"
                            >
                              <image :src="cjimg" mode="scaleToFill" />
                            </view>
                          </view>
                          <view
                            class="cj_item_right"
                            v-if="cj?.user_cate?.length != 1 && cj?.status == 1"
                          >
                            <image src="@/static/yunchan/chat/right.png" mode="scaleToFill" />
                          </view>
                        </view>
                      </view>
                      <h-line
                        v-show="JSON.parse(item?.payload?.extension)?.data?.length - 1 != index"
                        style="margin: 20rpx"
                        height="1"
                        bgColor="#EEEEEE"
                      >
                      </h-line>
                    </view>

                    <view
                      class="find_all"
                      @click="
                        navigateTo(
                          `/pregnancys/index/chat-record-test?ids=${getids(
                            JSON.parse(item?.payload?.extension),
                          )}&uid=${props?.uid}`,
                        )
                      "
                      v-if="
                        (JSON.parse(item?.payload?.extension)?.length > 1 &&
                          JSON.parse(item?.payload?.extension)?.[0]?.status == 0) ||
                        (JSON.parse(item?.payload?.extension)?.length > 1 &&
                          JSON.parse(item?.payload?.extension)?.[0]?.status == 2)
                      "
                    >
                      查看全部
                    </view>
                    <view
                      v-else-if="
                        JSON.parse(item?.payload?.extension)?.[0]?.status == 0 ||
                        JSON.parse(item?.payload?.extension)?.[0]?.status == 2
                      "
                      class="find_detail"
                      @click="
                        navigateTo(
                          `/pregnancys/index/time-table/record-detail?id=${
                            JSON.parse(item?.payload?.extension)?.[0]?.id
                          }&isshow=${false}&uid=${props?.uid}`,
                        )
                      "
                    >
                      查看详情
                    </view>
                    <view
                      @click="
                        navigateTo(
                          `/pregnancys/index/chat-record-test?ids=${getids(
                            JSON.parse(item?.payload?.extension),
                          )}&uid=${props?.uid}`,
                        )
                      "
                      v-else-if="
                        JSON.parse(item?.payload?.extension)?.[0]?.status == 1 &&
                        JSON.parse(item?.payload?.extension)?.length > 1
                      "
                      class="find_detail1"
                    >
                      查看全部
                    </view>
                    <view
                      @click="
                        navigateTo(
                          `/pregnancys/index/chat-look-record?id=${
                            JSON.parse(item?.payload?.extension)?.[0]?.id
                          }&uid=${props?.uid}`,
                        )
                      "
                      v-else
                      class="find_detail1"
                    >
                      查看详情
                    </view>
                  </view>
                </view>
                <navigator
                  :url="`/pregnancys/weight-management/weight-record?isshow=${false}&day=1&uid=${
                    props?.uid
                  }`"
                  open-type="navigate"
                  hover-class="none"
                  class="text weight_box"
                  v-if="item?.payload?.data == '4'"
                >
                  <view class="weight_title">体重记录</view>
                  <view class="weight_time">
                    {{ JSON.parse(item?.payload?.extension)?.[0]?.time }} &nbsp更新
                  </view>
                  <view class="weight_add">
                    比孕前体重{{ JSON.parse(item?.payload?.extension)?.weight }}kg
                    {{ JSON.parse(item?.payload?.extension)?.[0]?.diff_weight }}
                  </view>
                  <view class="weight_now">
                    当前体重
                    <text style="font-size: 34rpx">
                      {{ JSON.parse(item?.payload?.extension)?.[0]?.num }}kg
                    </text>
                  </view>
                  <h-line style="margin-bottom: 20rpx" height="1" bgColor="#EEEEEE"></h-line>
                  <view class="find_detail">查看详情</view>
                </navigator>
                <view class="text eat_box" v-if="item?.payload?.data == '5'">
                  <view class="eat_title">饮食记录</view>
                  <view class="eat_time">
                    {{
                      JSON.parse(item?.payload?.extension)?.today
                        ? `${JSON.parse(item?.payload?.extension)?.today}&nbsp`
                        : ''
                    }}
                    {{ JSON.parse(item?.payload?.extension)?.date }}
                  </view>
                  <view class="eat_list">
                    <view
                      class="eat_item"
                      v-for="(fitem, index) of JSON.parse(item?.payload?.extension)?.data"
                      :key="index"
                    >
                      <view class="eat_food" v-if="fitem?.data?.length">
                        <view class="eat_food_left">{{ fitem.meal }}：</view>
                        <view class="eat_food_right">
                          <view
                            class="eat_food_item"
                            v-for="(i, index) of fitem?.data"
                            :key="index"
                          >
                            {{ i }}
                          </view>
                        </view>
                      </view>
                      <h-line
                        v-show="
                          JSON.parse(item?.payload?.extension)?.data.length - 1 != index &&
                          item?.payload?.description == 1 &&
                          fitem?.data?.length
                        "
                        style="margin: 20rpx 0"
                        height="1"
                        bgColor="#EEEEEE"
                      ></h-line>
                      <h-line
                        v-show="item?.payload?.description != 1 && fitem?.data?.length"
                        style="margin: 20rpx 0"
                        height="1"
                        bgColor="#EEEEEE"
                      ></h-line>
                    </view>
                  </view>
                  <!-- <navigator
                :url="`/pregnancy/weight-management/diet-record/foods-and-sport?isshow=${false}&day=1`"
                open-type="navigate"
                hover-class="none"
                class="find_detail"
                v-if="item?.payload?.description == 1"
              >
                查看详情
              </navigator> -->
                  <view
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-if="item?.payload?.description == 7"
                  >
                    近{{ item?.payload?.description }}天饮食记录
                  </view>
                  <view
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-else-if="item?.payload?.description == 14"
                  >
                    近{{ item?.payload?.description }}天饮食记录
                  </view>
                  <view
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-else-if="item?.payload?.description == 30"
                  >
                    近{{ item?.payload?.description }}天饮食记录
                  </view>
                  <view
                    class="find_more"
                    @click="
                      gotosleep('', item?.payload?.data, JSON.parse(item?.payload?.extension))
                    "
                    v-else-if="item?.payload?.description == 'all'"
                  >
                    全部饮食记录
                  </view>
                </view>
                <view class="text sport_box" v-if="item?.payload?.data == '6'">
                  <view class="sport_title">运动记录</view>
                  <view class="sport_time">
                    {{
                      JSON.parse(item?.payload?.extension)?.today
                        ? `${JSON.parse(item?.payload?.extension)?.today}&nbsp`
                        : ''
                    }}
                    {{ JSON.parse(item?.payload?.extension)?.date }}
                  </view>
                  <view
                    class="sport_obj"
                    v-for="(sitem, index) of JSON.parse(item?.payload?.extension)?.data"
                    :key="index"
                  >
                    运动名称：{{ sitem.name }}
                  </view>

                  <h-line
                    v-if="item?.payload?.description != 1"
                    style="margin-bottom: 20rpx"
                    height="1"
                    bgColor="#EEEEEE"
                  ></h-line>

                  <!-- <navigator
                :url="`/pregnancy/weight-management/diet-record/foods-and-sport?isshow=${false}&day=1`"
                open-type="navigate"
                hover-class="none"
                class="find_detail"
                v-if="item?.payload?.description == 1"
              >
                查看详情
              </navigator> -->
                  <view
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-if="item?.payload?.description == 7"
                  >
                    近{{ item?.payload?.description }}天运动记录
                  </view>
                  <view
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-else-if="item?.payload?.description == 14"
                  >
                    近{{ item?.payload?.description }}天运动记录
                  </view>
                  <view
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-else-if="item?.payload?.description == 30"
                  >
                    近{{ item?.payload?.description }}天运动记录
                  </view>
                  <view
                    @click="
                      gotosleep('', item?.payload?.data, JSON.parse(item?.payload?.extension))
                    "
                    class="find_more"
                    v-else-if="item?.payload?.description == 'all'"
                  >
                    全部运动记录
                  </view>
                </view>
                <view class="text sleep_box" v-if="item?.payload?.data == '7'">
                  <view class="sleep_title">睡眠记录</view>
                  <view class="sleep_time">
                    {{
                      JSON.parse(item?.payload?.extension)?.today
                        ? `${JSON.parse(item?.payload?.extension)?.today}&nbsp`
                        : ''
                    }}
                    {{ JSON.parse(item?.payload?.extension)?.date }}
                  </view>
                  <view class="sleep_list">
                    <view
                      class="sleep_item"
                      v-for="(slitem, index) of JSON.parse(item?.payload?.extension)?.data"
                      :key="index"
                    >
                      <view class="sleep_top">
                        <view class="sleep_item_left">
                          <image
                            v-if="slitem?.type == 2"
                            src="@/static/yunchan/chat/sun.png"
                            mode="scaleToFill"
                          />
                          <image v-else src="@/static/yunchan/chat/moon.png" mode="scaleToFill" />
                        </view>
                        <view
                          v-if="slitem?.type == 2"
                          style="margin: 0 86rpx 0 10rpx"
                          class="sleep_item_middle"
                        >
                          小憩
                        </view>
                        <view v-else style="margin: 0 30rpx 0 10rpx" class="sleep_item_middle">
                          夜间睡眠
                        </view>
                        <view
                          class="sleep_item_right"
                          :style="{ background: props.chat_type == 3 ? '#F6F6F6' : '#ede9ff' }"
                        >
                          <view class="sleep_item_right_top">{{ slitem?.hour }} 小时</view>
                          <view class="sleep_item_right_btm">
                            {{ slitem?.start_time }}—{{ slitem?.end_time }}
                          </view>
                        </view>
                      </view>
                      <h-line
                        v-show="JSON.parse(item?.payload?.extension)?.data?.length - 1 != index"
                        style="margin-bottom: 15rpx"
                        height="1"
                        bgColor="#EEEEEE"
                      >
                      </h-line>
                    </view>
                  </view>
                  <!-- <navigator
                :url="`/pregnancy/weight-management/sleep-record/index?isshow=${false}&day=1&date=${optionsDate}`"
                open-type="navigate"
                hover-class="none"
                class="find_detail"
                v-if="item?.payload?.description == 1"
              >
                查看详情
              </navigator> -->
                  <view
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-if="item?.payload?.description == 7"
                  >
                    近{{ item?.payload?.description }}天睡眠记录
                  </view>
                  <view
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-else-if="item?.payload?.description == 14"
                  >
                    近{{ item?.payload?.description }}天睡眠记录
                  </view>
                  <view
                    class="find_more"
                    @click="
                      gotosleep(
                        item?.payload?.description,
                        item?.payload?.data,
                        JSON.parse(item?.payload?.extension),
                      )
                    "
                    v-else-if="item?.payload?.description == 30"
                  >
                    近{{ item?.payload?.description }}天睡眠记录
                  </view>
                  <view
                    class="find_more"
                    @click="
                      gotosleep('', item?.payload?.data, JSON.parse(item?.payload?.extension))
                    "
                    v-else-if="item?.payload?.description == 'all'"
                  >
                    全部睡眠记录
                  </view>
                </view>
                <view
                  class="text article_box"
                  @click="gotoShop(item)"
                  v-if="item?.payload?.data == '8'"
                >
                  <view class="article_title u-line-2">
                    {{ JSON.parse(item?.payload?.extension)?.title }}
                  </view>
                  <view class="content_box">
                    <view class="content_box_text u-line-3">
                      {{ extractTextFromRichText(JSON.parse(item?.payload?.extension)?.content) }}
                    </view>

                    <view class="content_box_image">
                      <image
                        :src="JSON.parse(item?.payload?.extension)?.image?.[0]"
                        mode="aspectFill"
                      />
                    </view>
                  </view>
                  <h-line
                    v-if="
                      JSON.parse(item?.payload?.extension)?.avatar ||
                      JSON.parse(item?.payload?.extension)?.nickname
                    "
                    style="margin-bottom: 10rpx; margin-top: 20rpx"
                    height="1"
                    bgColor="#EEEEEE"
                  >
                  </h-line>
                  <view class="tag_box">
                    <view class="tag_box_img">
                      <image src="@/static/yunchan/chat/chat_logo.png" mode="aspectFill" />
                    </view>
                    <view class="tag_box_text"> 咪婴伴侣 </view>
                  </view>
                </view>
                <!-- 用户头像 -->
                <image
                  v-if="item?.cloudCustomData != 'isnoline' && item?.type != 'showTime'"
                  style="background: #fff"
                  @click.stop="gotopageuser"
                  :src="
                    myAvatar || `https://ossresource.miyingbl.com/uploads/20230918/test/logo.png`
                  "
                  mode="aspectFill"
                  class="img"
                />
              </view>
            </view>
          </view>
        </view>
      </scroll-view>
    </swiper-item>
    <swiper-item>
      <scroll-view
        :style="{
          height: `calc(100vh - ${88 + topinfo + 'rpx'})`,
        }"
        :scroll-y="true"
      >
        <yundata v-if="props.chat_type == 1" :userIds="props.uid"></yundata>
        <mandata v-if="props.chat_type == 2" :userIds="props.uid"></mandata>
        <childdata v-if="props.chat_type == 3" :userIds="props.uid"></childdata>
      </scroll-view>
    </swiper-item>
  </swiper>
  <!-- 底部信息 -->
  <view
    v-if="current_tab == 0 && isChat_is_ok?.is_end == 0"
    :style="{ bottom: keyHeight + 'px' }"
    class="bottom1 safe-area-inset-bottom"
    :class="{ active: showImg }"
  >
    <view class="flex" :style="{ paddingBottom: isFocus ? '16rpx' : '84rpx' }">
      <image
        v-if="!audioShow"
        src="@/static/yunchan/chat/sound.png"
        style="width: 44rpx; height: 44rpx"
        @click="toAudio"
      />
      <image
        v-else
        src="@/static/yunchan/chat/send_key.png"
        style="width: 44rpx; height: 44rpx"
        @click="toAudio"
      />
      <view class="ipt">
        <view class="ipt_au" v-if="audioShow" @longpress="longpressBtn" @touchend="touchendBtn">
          按住说话
        </view>
        <textarea
          v-else
          :selection-start="-18"
          :adjust-position="false"
          placeholder-style="
          font-family: PingFangSC, PingFang SC;
          font-weight: 400;
          font-size: 28rpx;
          color: #AAAAAA;"
          placeholder="良言一句三冬暖…"
          type="text"
          :maxlength="140"
          :auto-height="true"
          v-model.trim="iptVal"
          confirm-type="send"
          :confirm-hold="true"
          :focus="isFocus"
          @blur="onblur"
          @focus="onfocus"
          :cursor-spacing="15"
          @confirm="sendChatMsgFn"
        />
      </view>
      <view v-if="!audioShow && iptVal" class="send_text" @touchend.prevent="sendChatMsgFn">
        发送
      </view>
      <image
        v-else
        src="@/static/yunchan/chat/more.png"
        style="width: 44rpx; height: 44rpx"
        mode="aspectFit"
        @click="onshowImg"
      />
    </view>
    <!-- <h-line v-if="showImg" height="1" style="margin-bottom: 10rpx" bgColor="#E8E8E8"> </h-line> -->
    <view v-if="showImg">
      <view v-if="!showConfig">
        <swiper
          class="swiper"
          indicator-color="#dadada"
          indicator-active-color="#5b5b5b"
          :indicator-dots="showMoreList.length > 1"
          :disable-touch="!(showMoreList.length > 1)"
          :autoplay="false"
        >
          <swiper-item>
            <view class="more_lsit">
              <view class="more_item" v-for="(item, i) of showMoreList[0]" :key="i">
                <view class="bot_img" @click="onMore(item.type)">
                  <image :src="item.img" mode="aspectFit" />
                </view>
                <view class="font">{{ item.title }}</view>
              </view>
            </view>
          </swiper-item>
          <swiper-item v-if="showMoreList?.[1]?.length">
            <view class="more_lsit">
              <view class="more_item" v-for="(item, i) of showMoreList[1]" :key="i">
                <view class="bot_img" @click="onMore(item?.type)">
                  <image :src="item?.img" mode="aspectFit" />
                </view>
                <view class="font">{{ item?.title }}</view>
              </view>
            </view>
          </swiper-item>
        </swiper>
      </view>
      <view v-else>
        <view v-if="MsgConfigList.length && MsgConfigList.length > 0">
          <scroll-view class="scroll-v" scroll-y>
            <view class="msg_config_box">
              <view
                class="msg_config"
                v-for="(item, index) in MsgConfigList"
                :key="index"
                @click="msgItemChage(item?.content)"
              >
                <text>{{ item?.content }}</text>
              </view>
            </view>
          </scroll-view>
          <view class="operating_area">
            <view class="left_area" @click="addMsgConfig()">
              <up-icon name="edit-pen" color="#00C1B9" size="18"></up-icon>
              <view style="margin-bottom: 4rpx; margin-left: 4rpx">添加</view>
            </view>
            <view class="right_area" @click="setMsgConfig()">
              <up-icon name="setting" color="#00C1B9" size="16"></up-icon>
              <view style="margin-bottom: 5rpx; margin-left: 4rpx">设置</view>
            </view>
          </view>
        </view>
        <view v-if="isShowNo && MsgConfigList.length == 0">
          <h-not-list
            title="暂无内容"
            defaultHeight="300"
            img="/static/images/nones.png"
          ></h-not-list>
          <view class="nones_add_box" @click="addMsgConfig()">
            <view class="nones_add_btn">{{
              configType == 2 ? '添加常用回复' : '添加常用建议'
            }}</view>
          </view>
        </view>
      </view>
    </view>
  </view>
  <view v-if="current_tab == 0 && isChat_is_ok?.is_end != 0" class="chat_end_box bottom1">
    <view class="end_tip_box">
      <view class="icon_box">
        <image class="icon" src="@/static/yunchan/chat/end_tip.png" mode="scaleToFill" />
      </view>
      <view class="end_tip">问诊已结束，⽆法发送消息</view>
    </view>
    <view class="placheholder_box"></view>
  </view>
  <view v-if="longPress == 2" class="prompt-layer">
    <view class="prompt-popup">
      <view class="p">{{ '剩余：' + count + 's' }}</view>
      <view style="font-size: 42rpx; margin-top: 30rpx">松手 完成</view>
    </view>
  </view>
  <h-authpup
    ref="authpup"
    :h="system?.statusHeight"
    type="top"
    @changeAuth="changeAuth"
    permissionID="CAMERA"
  ></h-authpup>
  <h-authpup
    ref="authpupAuth"
    :h="system?.statusHeight"
    type="top"
    @changeAuth="changeAuthAudio"
    permissionID="RECORD_AUDIO"
  >
  </h-authpup>
  <!-- 商品/服务弹窗 -->
  <u-popup
    :safeAreaInsetBottom="false"
    mode="bottom"
    :show="carSearchShow"
    @close="closeSearchCart"
    @open="openSearchCart"
    z-index="11188"
    overlayStyle="z-index:11188;"
    bgColor="#F6F6F6"
  >
    <view style="height: 100vh">
      <view class="heard_top">
        <view :style="`height:${system?.statusHeight}rpx`"></view>
        <view class="poput_title" v-if="!focus">
          <view class="car_box_search_icon" @click="closeSearchCart">
            <image src="@/static/yunchan/chat/back.png" mode="scaleToFill"></image>
          </view>
          <view class="title_left">选择商品/服务</view>
          <view class="title_right" @click="closeSearchCart">取消</view>
        </view>
        <view class="car_box_search">
          <view class="car_box_search_icon" @click="handleBlur" v-if="focus">
            <image src="@/static/yunchan/chat/back.png" mode="scaleToFill"></image>
          </view>
          <view class="car_box_search_l" :style="{ margin: !focus ? '0 24rpx' : '' }">
            <u-search
              placeholder="搜索想要分享的商品/服务"
              v-model="carKeyword"
              bgColor="#F5F6F8"
              :showAction="false"
              :focus="focus"
              @clear="clearSearch"
              @search="toSearchPopup"
              @focus="handleFocus"
              @custom="toSearchPopup"
              actionText="搜索"
              :actionStyle="{
                color: '#967BFF',
                fontSize: '30rpx',
                lineHeight: '54rpx',
                marginRight: '35rpx',
              }"
            ></u-search>
          </view>
          <view class="car_box_search_l_btn" @click="toSearchPopup" v-if="focus">搜索</view>
        </view>
        <!-- 搜索tab -->
        <view class="search-tab" v-if="showTab && !isnoshowtab">
          <u-tabs
            :list="tabList"
            :scrollable="false"
            lineWidth="20"
            lineHeight="3"
            :current="current"
            lineColor="#00C1B9"
            :activeStyle="{
              'font-family': ' PingFangSC, PingFang SC',
              'font-weight': 500,
              'font-size': '30rpx',
              color: '#202020',
            }"
            :inactiveStyle="{
              color: '#727272',
              'font-family': ' PingFangSC, PingFang SC',
              'font-weight': 500,
              'font-size': '30rpx',
            }"
            @click="handleChangeTab"
          ></u-tabs>
        </view>
      </view>

      <scroll-view
        class="car_box"
        @scrolltolower="listScroll"
        :scroll-y="true"
        :style="{
          height: `calc(100vh - ${276 + system?.statusHeight + 'rpx'})`,
        }"
      >
        <view v-if="showTab">
          <view
            class="trolley-box"
            @click="goItem(item)"
            v-for="(item, index) in cartTrolleyList"
            :key="item.mer_id"
          >
            <view class="trolley-bottom mt20">
              <view class="trolley-img">
                <image :src="item?.image" mode="scaleToFill" />
                <view class="trolley-img_none" v-if="item?.is_fail == 1">商品已下架</view>
              </view>
              <view class="trolley-info">
                <view class="trolley-name u-line-2">{{ item?.store_name }}</view>
                <view class="trolley-rows">
                  <view class="trolley-price">
                    <text class="priceColor">¥</text>
                    <text
                      class="priceColor"
                      style="font-weight: 800; font-size: 40rpx; margin-right: 28rpx"
                      >{{ item?.price }}</text
                    >
                    <text class="ot_price" v-if="item?.ot_price">¥</text>
                    <text
                      class="ot_price"
                      v-if="item?.ot_price"
                      style="text-decoration: line-through"
                      >{{ item?.ot_price }}</text
                    >
                  </view>
                </view>
              </view>
              <view
                class="trolley-choose"
                :class="{ chooseTrue: item?.check }"
                @click.stop="goodsCheckCart(item)"
              >
                <u-icon name="checkmark" size="12" color="#fff"></u-icon>
              </view>
            </view>
          </view>
        </view>
        <view v-if="cartTrolleyList?.length == 0 && noList" class="nocontent">
          暂时没有找到相关商品/服务
        </view>
        <h-line height="180"></h-line>
        <view v-if="!showTab && !noList" class="tip_text">
          快速查找收藏、购物车、浏览足迹中的商品/服务
        </view>
      </scroll-view>
      <view class="trolley-totalize" v-if="cartTrolleyList?.length != 0">
        <view
          class="trolley-choose"
          :class="{ chooseTrue: chooseAll, chooseFalse: !chooseAll }"
          @click="clickTotalizeCart"
        >
          <u-icon name="checkmark" size="12" color="#ffffff"></u-icon>
        </view>
        <view class="totalize-text1">全选</view>
        <view class="totalize-text2" v-if="chooseCount > 0">已选中{{ chooseCount }}条</view>
        <view
          class="totalize-button"
          :style="
            chooseCount > 0
              ? 'background-color:#00C1B9;color:#ffffff'
              : 'background-color: #C5C5C5;'
          "
          @click="sendCart"
        >
          发送
        </view>
      </view>
    </view>
  </u-popup>
  <!-- 视频文章 -->
  <u-popup
    :safeAreaInsetBottom="false"
    mode="bottom"
    :show="articleShow"
    z-index="11188"
    overlayStyle="z-index:11188;"
    bgColor="#F6F6F6"
  >
    <articlePopup @close="closeSearcharticle" @sendArticle="sendArticle" />
  </u-popup>
  <up-action-sheet
    :actions="list"
    :closeOnClickOverlay="true"
    :closeOnClickAction="true"
    @close="closeOverlay"
    @select="sendReduce"
    cancelText="取消"
    round="16"
    :show="show"
  ></up-action-sheet>
  <h-modal
    @clear="popupShow = false"
    :show="popupShow"
    @bind="confirmClear"
    :titlea="titlea"
    leftBtn="取消"
    rightBtn="确认发送"
  />
</template>

<style lang="scss">
page {
  background-color: #f6f6f6;
  font-size: 30rpx;
  color: #525252;
  margin: 0rpx;
  padding: 0rpx;
  box-sizing: border-box;
  position: relative;
}
.info_box {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 573rpx;
  background: #f6f6f6;
  border-radius: 16rpx 16rpx 0 0;
  border: 1rpx solid transparent;
  .title {
    font-family: PingFang SC, PingFang SC;
    font-weight: 500;
    font-size: 30rpx;
    color: #000000;
    text-align: center;
    margin: 30rpx 0;
  }
  .user_box {
    width: 683rpx;
    height: 255rpx;
    background: linear-gradient(180deg, v-bind(gradualchange) 0%, #ffffff 100%);
    border-radius: 20rpx;
    padding: 33rpx 5rpx 44rpx 27rpx;
    margin-bottom: 30rpx;

    .info_title {
      display: flex;
      margin-bottom: 9rpx;

      image {
        width: 37rpx;
        height: 30rpx;
      }
      .info_text {
        font-family: PingFang SC, PingFang SC;
        font-weight: 600;
        font-size: 26rpx;
        color: #333333;
        margin-left: 14rpx;
      }
    }
    .info_item {
      margin-top: 18rpx;
      display: flex;
      .left {
        text-align: left;
        width: 150rpx;
        height: 26rpx;
        font-family: PingFang SC, PingFang SC;
        font-weight: 500;
        font-size: 23rpx;
        color: #000000;
      }
      .middle {
        font-family: PingFang SC, PingFang SC;
        font-weight: 600;
        font-size: 26rpx;
        color: #333333;
        margin-right: 21rpx;
      }
      .middle1 {
        width: 188rpx;
        height: 26rpx;
        margin-right: 30rpx;
        font-family: PingFang SC, PingFang SC;
        font-weight: 500;
        font-size: 28rpx;
        color: #333333;
      }
      .right {
        font-family: PingFang SC, PingFang SC;
        font-weight: 500;
        font-size: 18rpx;
        color: #333333;
      }
      .right1 {
        display: flex;
        .right_left {
          width: 150rpx;
          height: 27rpx;
          font-family: PingFang SC, PingFang SC;
          font-weight: 500;
          font-size: 23rpx;
          color: #000000;
        }
        .right_right {
          font-family: PingFang SC, PingFang SC;
          font-weight: 500;
          font-size: 28rpx;
          color: #333333;
        }
      }
    }
  }
  .user_btn_box {
    width: 750rpx;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 147rpx;
    background: #ffffff;
    box-shadow: 0rpx 4rpx 4rpx 9rpx rgba(226, 226, 226, 0.25);
    padding: 0 43rpx;
    .btn_left {
      width: 296rpx;
      height: 76rpx;
      text-align: center;
      line-height: 76rpx;
      background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
      border-radius: 341rpx 341rpx 341rpx 341rpx;
      opacity: 0.57;
      font-family: PingFang SC, PingFang SC;
      font-weight: 600;
      font-size: 32rpx;
      color: #ffffff;
    }
    .btn_right {
      width: 296rpx;
      height: 76rpx;
      text-align: center;
      line-height: 76rpx;
      background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
      border-radius: 341rpx 341rpx 341rpx 341rpx;
      font-family: PingFang SC, PingFang SC;
      font-weight: 600;
      font-size: 32rpx;
      color: #ffffff;
    }
  }
}

.followTip {
  justify-content: flex-start;
  background-color: white;
  padding: 10rpx 20rpx;
  align-items: center;
  font-size: 28rpx;
  .follow {
    background-color: rgb(28, 137, 137);
    color: white;
    border-radius: 10rpx;
    padding: 5rpx 20rpx;
  }
}

.video_a {
  width: 500rpx;
}

.swiper {
  height: 440rpx;

  .more_lsit {
    padding: 20rpx 50rpx 0 50rpx;
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
    border: 1rpx solid transparent;

    .more_item {
      display: flex;
      flex-direction: column;
      align-items: center;
      margin-right: 48rpx;
      margin-bottom: 20rpx;
      .bot_img {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 125rpx;
        height: 125rpx;
        background: #f1f1f1;
        border-radius: 16rpx 16rpx 16rpx 16rpx;
        image {
          width: 45rpx;
          height: 45rpx;
        }
      }
      .font {
        font-family: PingFangSC, PingFang SC;
        font-weight: 400;
        font-size: 26rpx;
        color: #5c5c5c;
        margin-top: 15rpx;
      }
    }
    .more_item:nth-child(4n) {
      margin-right: 0;
    }
  }
}
::v-deep .uni-swiper-dot {
  width: 11rpx;
  height: 11rpx;
}
::v-deep .u-gap {
  height: 1rpx !important;
}

.container1 {
  background-color: #f6f6f6;
  padding: 0 38rpx 0 38rpx;
  border-bottom: 1rpx solid transparent;

  .section {
    border-bottom: 1rpx solid transparent;
    .message_item {
      display: flex;
      flex-direction: column;
      margin-bottom: 37rpx;
      .time-line {
        align-self: center;
        margin-top: 20rpx;
      }
      .isonline {
        align-self: center;
        font-family: PingFang SC, PingFang SC;
        font-weight: 500;
        font-size: 20rpx;
        color: #696969;
      }
      .user {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        .text {
          margin-right: 28rpx;
          position: relative;
          width: auto;
          max-width: 70vw;
          height: auto;
          padding: 14rpx 26rpx 14rpx 16rpx;
          border-radius: 10rpx;
          text-align: left;
          background: #e8e9e9;
          border-radius: 20rpx;
          word-wrap: break-word;
          font-family: PingFangSC, PingFang SC;
          font-weight: 400;
          font-size: 28rpx;
          color: #202020;
        }
        .img_box {
          background: #f6f6f6;
        }
        .sound_box {
          position: relative;
          display: flex;
          align-items: center;
          .sound_num {
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #000000;
          }
        }

        .img {
          width: 64rpx;
          height: 64rpx;
          border-radius: 50%;
        }

        .shop_box {
          width: 403rpx;
          height: 168rpx;
          background: #ffffff;
          border-radius: 8rpx 8rpx 8rpx 8rpx;
          padding: 13rpx 6rpx 17rpx 15rpx;
          display: flex;
          .img_box {
            width: 138rpx;
            height: 138rpx;
            border-radius: 10rpx;
            margin-right: 9rpx;
            image {
              width: 138rpx;
              height: 138rpx;
              border-radius: 10rpx;
            }
          }
          .shop_info_box {
            display: flex;
            flex-direction: column;
            .shop_info_title {
              width: 235rpx;
              line-height: 34rpx;
              height: 78rpx;
              text-align: left;
              font-family: PingFang SC, PingFang SC;
              font-weight: 500;
              font-size: 24rpx;
              color: #333333;
              overflow: hidden;
            }
            .shop_info_price {
              display: flex;
              align-items: center;
              margin-top: 28rpx;
              .price {
                margin-right: 24rpx;
                color: #de272a;
                .price_icon {
                  margin-top: 8rpx;
                  font-family: PingFang SC, PingFang SC;
                  font-weight: 600;
                  font-size: 22rpx;
                }
                .price_num {
                  font-family: PingFang SC, PingFang SC;
                  font-weight: 800;
                  font-size: 32rpx;
                  color: #de272a;
                }
              }
              .und_price {
                font-family: PingFang SC, PingFang SC;
                font-weight: 500;
                font-size: 22rpx;
                color: #6b6b6b;
                text-decoration: line-through;
              }
            }
          }
        }

        .img {
          width: 64rpx;
          height: 64rpx;
          border-radius: 50%;
        }

        .person_box {
          width: 471rpx;
          background: linear-gradient(180deg, v-bind(gradualchange) 10%, #ffffff 30%);

          border-radius: 20rpx 20rpx 20rpx 20rpx;
          padding: 26rpx 0 16rpx 26rpx;
          display: flex;
          flex-direction: column;
          .per_heard {
            display: flex;
            margin-bottom: 14prx;
            image {
              width: 37rpx;
              height: 30rpx;
              margin-right: 14rpx;
            }
          }
          .per_title {
            font-family: PingFang SC, PingFang SC;
            font-weight: 600;
            font-size: 26rpx;
            color: #333333;
          }
          .per_info {
            margin-left: 51rpx;
            display: flex;
            flex-direction: column;
            .per_info_item {
              margin-bottom: 17rpx;
              display: flex;
              align-items: center;
              .item_left {
                text-align: left;
                width: 157rpx;
                width: 150rpx;
                font-family: PingFang SC, PingFang SC;
                font-weight: 500;
                font-size: 23rpx;
                color: #000000;
              }
              .item_right {
                font-family: PingFang SC, PingFang SC;
                font-weight: 500;
                font-size: 26rpx;
                color: #333333;
              }
            }
          }
        }
        .cj_box {
          background: linear-gradient(180deg, v-bind(gradualchange) 10%, #ffffff 30%);
          border-radius: 8rpx;
          width: 471rpx;
          padding: 30rpx;
          .cj_title {
            font-family: PingFang SC, PingFang SC;
            font-weight: 600;
            font-size: 32rpx;
            color: #333333;
            margin-bottom: 20rpx;
          }
          .cj_list {
            display: flex;
            flex-direction: column;
            .cj_item {
              flex-direction: column;
              width: 411rpx;
              display: flex;
              .cj_item_left {
                display: flex;
                flex-direction: column;
                .noready {
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                  .noready_text {
                    display: flex;
                    flex-direction: column;
                    .cj_item_title {
                      font-family: PingFang SC, PingFang SC;
                      font-weight: 500;
                      font-size: 28rpx;
                      color: #333333;
                    }
                    .cj_item_xm {
                      margin-top: 20rpx;
                      font-family: PingFang SC, PingFang SC;
                      font-weight: 500;
                      font-size: 24rpx;
                      color: #666666;
                    }
                  }
                  .cj_item_right {
                    width: 8rpx;
                    height: 16rpx;
                    image {
                      width: 8rpx;
                      height: 16rpx;
                    }
                  }
                }
                .ready_image {
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                  .cj_img_box {
                    width: 411rpx;
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    .cj_item_img {
                      margin-right: 30rpx;
                      width: 109rpx;
                      height: 132rpx;
                      border-radius: 12rpx 12rpx 12rpx 12rpx;
                      image {
                        width: 109rpx;
                        height: 132rpx;
                        border-radius: 12rpx 12rpx 12rpx 12rpx;
                      }
                    }
                  }
                  .cj_item_right {
                    width: 8rpx;
                    height: 16rpx;
                    image {
                      width: 8rpx;
                      height: 16rpx;
                    }
                  }
                }
              }
            }
            .find_detail {
              width: 128rpx;
              height: 43rpx;
              background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
              border-radius: 91rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: 500;
              font-size: 24rpx;
              color: #ffffff;
              text-align: center;
              line-height: 43rpx;
            }
            .find_detail1 {
              width: 128rpx;
              height: 43rpx;
              background: linear-gradient(90deg, v-bind(gradualchange) 0%, v-bind(color) 100%);
              border-radius: 91rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: 500;
              font-size: 24rpx;
              color: #ffffff;
              text-align: center;
              line-height: 43rpx;
            }
            .find_all {
              width: 128rpx;
              height: 43rpx;
              background: linear-gradient(90deg, v-bind(gradualchange) 0%, v-bind(color) 100%);
              border-radius: 91rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: 500;
              font-size: 24rpx;
              color: #ffffff;
              text-align: center;
              line-height: 43rpx;
            }
          }
        }
        .weight_box {
          background: linear-gradient(180deg, v-bind(buttonColor) 10%, #ffffff 30%);

          border-radius: 8rpx;
          width: 471rpx;
          display: flex;
          flex-direction: column;
          padding: 30rpx;
          .weight_title {
            font-family: PingFang SC, PingFang SC;
            font-weight: 600;
            font-size: 32rpx;
            color: #333333;
            margin-bottom: 10rpx;
          }
          .weight_time {
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            line-height: 28rpx;
            margin-bottom: 20rpx;
            color: #666666;
          }
          .weight_add {
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #666666;
            margin-bottom: 20rpx;
            line-height: 33rpx;
          }
          .weight_now {
            margin-bottom: 20rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #333333;
            line-height: 33rpx;
          }
          .find_detail {
            width: 128rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
          }
        }
        .eat_box {
          background: linear-gradient(180deg, v-bind(gradualchange) 10%, #ffffff 30%);
          border-radius: 8rpx;
          width: 471rpx;
          padding: 30rpx;

          .eat_title {
            font-family: PingFang SC, PingFang SC;
            font-weight: 600;
            font-size: 32rpx;
            color: #333333;
            margin-bottom: 20rpx;
          }
          .eat_time {
            margin-bottom: 20rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #333333;
            line-height: 33rpx;
          }
          .eat_list {
            .eat_item {
              .eat_food {
                display: flex;
                .eat_food_left {
                  width: 112rpx;
                  font-family: PingFang SC, PingFang SC;
                  font-weight: 500;
                  font-size: 28rpx;
                  color: #333333;
                }
                .eat_food_right {
                  flex: 1;
                  margin-left: 22rpx;
                  .eat_food_item {
                    font-family: PingFang SC, PingFang SC;
                    font-weight: 500;
                    font-size: 28rpx;
                    color: #333333;
                  }
                }
              }
            }
          }
          .find_detail {
            width: 128rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
          }
          .find_more {
            width: 221rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
          }
        }
        .sport_box {
          background: linear-gradient(180deg, v-bind(gradualchange) 10%, #ffffff 30%);
          border-radius: 8rpx;
          width: 471rpx;
          padding: 30rpx;

          .sport_title {
            font-family: PingFang SC, PingFang SC;
            font-weight: 600;
            font-size: 32rpx;
            color: #333333;
            margin-bottom: 20rpx;
          }
          .sport_time {
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #333333;
            line-height: 33rpx;
            margin-bottom: 20rpx;
          }
          .sport_obj {
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #333333;
            margin-bottom: 20rpx;
          }
          .sport_obj:last-child {
            margin-bottom: 0;
          }
          .find_detail {
            width: 128rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
          }
          .find_more {
            width: 221rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
          }
        }
        .sleep_box {
          background: linear-gradient(180deg, v-bind(gradualchange) 10%, #ffffff 30%);
          border-radius: 8rpx;
          width: 471rpx;
          padding: 30rpx;

          .sleep_title {
            font-family: PingFang SC, PingFang SC;
            font-weight: 600;
            font-size: 32rpx;
            color: #333333;
            margin-bottom: 20rpx;
          }
          .sleep_time {
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #333333;
            line-height: 33rpx;
            margin-bottom: 35rpx;
          }
          .sleep_list {
            display: flex;
            flex-direction: column;

            .sleep_item {
              display: flex;
              align-items: center;
              flex-direction: column;

              .sleep_top {
                display: flex;
                align-items: center;
                padding-bottom: 15rpx;
                .sleep_item_left {
                  width: 55rpx;
                  height: 55rpx;
                  image {
                    width: 55rpx;
                    height: 55rpx;
                  }
                }
                .sleep_item_middle {
                  font-family: PingFang SC, PingFang SC;
                  font-weight: 500;
                  font-size: 28rpx;
                  color: #333333;
                }
                .sleep_item_right {
                  padding: 7rpx 26rpx 10rpx;
                  display: flex;
                  flex-direction: column;
                  width: 204rpx;
                  background: #ede9ff;
                  border-radius: 16rpx 16rpx 16rpx 16rpx;
                  .sleep_item_right_top {
                    font-family: PingFang SC, PingFang SC;
                    font-weight: 500;
                    font-size: 28rpx;
                    color: #333333;
                  }
                  .sleep_item_right_btm {
                    width: 100%;
                    margin-top: 7rpx;
                    font-family: PingFang SC, PingFang SC;
                    font-weight: 500;
                    font-size: 23rpx;
                    color: #333333;
                  }
                }
              }
            }
            .sleep_item:last-child .sleep_top {
              padding-bottom: 0;
            }
          }
          .find_detail {
            width: 128rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
          }
          .find_more {
            width: 221rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
            margin-top: 25rpx;
          }
        }
        .article_box {
          width: 450rpx;
          background: #ffffff;
          border-radius: 20rpx;
          padding: 15rpx 15rpx 10rpx 15rpx;
          .article_title {
            font-family: PingFangSC, PingFang SC;
            font-weight: 500;
            font-size: 26rpx;
            color: #202020;
            line-height: 37rpx;
            margin-bottom: 10rpx;
          }
          .content_box {
            display: flex;
            justify-content: space-between;
            .content_box_text {
              margin-right: 30rpx;
              flex: 1;
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 24rpx;
              color: #5c5c5c;
              line-height: 33rpx;
            }
            .content_box_image {
              width: 100rpx;
              height: 100rpx;
              background: #d8d8d8;
              border-radius: 10rpx;
              image {
                width: 100rpx;
                height: 100rpx;
                background: #d8d8d8;
                border-radius: 10rpx;
              }
            }
          }
          .tag_box {
            display: flex;
            align-items: center;
            .tag_box_img {
              margin-right: 10rpx;
              image {
                width: 24rpx;
                height: 18rpx;
              }
            }
            .tag_box_text {
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 24rpx;
              color: #aaaaaa;
            }
          }
        }
      }
      .expert {
        position: relative;
        text-align: right;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        .text {
          margin-left: 28rpx;
          position: relative;
          width: auto;
          max-width: 70vw;
          height: auto;
          padding: 14rpx 16rpx 14rpx 26rpx;
          border-radius: 10rpx;
          text-align: left;
          background: #ffffff;
          border-radius: 20rpx;
          font-family: PingFangSC, PingFang SC;
          font-weight: 400;
          font-size: 28rpx;
          color: #202020;
        }
        .sound_box {
          position: relative;
          display: flex;
          align-items: center;
          .sound_num {
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #000000;
          }
        }
        .time-line {
          align-self: center;
          margin: 30rpx 0;
        }
        .img {
          width: 64rpx;
          height: 64rpx;
          border-radius: 50%;
        }
        .baby_info_box {
          width: 471rpx;
          background: linear-gradient(180deg, #4fe5df 10%, #ffffff 30%);
          // background: linear-gradient(
          //   180deg,
          //   rgba(79, 229, 223, 0.5) 0%,
          //   rgba(79, 229, 223, 0.1) 100%
          // );
          border-radius: 20rpx 20rpx 20rpx 20rpx;
          padding: 30rpx 0 30rpx 30rpx;
          display: flex;
          flex-direction: column;

          .per_heard {
            font-family: PingFang SC, PingFang SC;
            font-weight: 600;
            font-size: 32rpx;
            color: #333333;
            margin-bottom: 20rpx;
          }

          .per_info {
            display: flex;
            flex-direction: column;

            .per_info_item {
              margin-bottom: 17rpx;
              display: flex;
              align-items: center;

              .item_left {
                text-align: left;
                width: 157rpx;
                width: 150rpx;
                font-family: PingFang SC, PingFang SC;
                font-weight: 500;
                font-size: 23rpx;
                color: #000000;
              }

              .item_right {
                font-family: PingFang SC, PingFang SC;
                font-weight: 500;
                font-size: 28rpx;
                color: #333333;
              }

              &:last-child {
                margin-bottom: 0;
              }
            }
          }
        }

        .vaccine_box {
          width: 471rpx;
          background: linear-gradient(180deg, v-bind(gradualchange) 10%, #ffffff 30%);
          border-radius: 20rpx 20rpx 20rpx 20rpx;
          padding: 30rpx 0 30rpx 30rpx;
          display: flex;
          flex-direction: column;

          .vaccine_header {
            display: flex;
            align-items: center;

            .vaccine_tag {
              margin-left: 10rpx;
              background: transparent;
              border-radius: 6rpx 6rpx 6rpx 6rpx;
              border: 1rpx solid #999999;
              padding: 0 8rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: 400;
              font-size: 26rpx;
              color: #999999;
              line-height: 32rpx;
            }
          }

          .cj_list {
            display: flex;
            flex-direction: column;

            .cj_title {
              font-family: PingFang SC, PingFang SC;
              font-weight: 600;
              font-size: 32rpx;
              color: #333333;
              margin-bottom: 20rpx;
            }

            .cj_item {
              flex-direction: column;
              width: 411rpx;
              display: flex;

              .cj_item_left {
                display: flex;
                flex-direction: column;

                .noready {
                  display: flex;
                  justify-content: space-between;
                  align-items: center;

                  .noready_text {
                    display: flex;
                    flex-direction: column;

                    .cj_item_title {
                      font-family: PingFang SC, PingFang SC;
                      font-weight: 500;
                      font-size: 28rpx;
                      color: #333333;
                    }

                    .cj_item_xm {
                      margin-top: 10rpx;
                      font-family: PingFang SC, PingFang SC;
                      font-weight: 400;
                      font-size: 28rpx;
                      color: #666666;
                    }

                    .practical_item_xm {
                      margin-top: 10rpx;
                      font-family: PingFang SC, PingFang SC;
                      font-weight: 400;
                      font-size: 26rpx;
                      color: #999999;
                    }
                  }
                }

                .ready_image {
                  display: flex;
                  justify-content: space-between;
                  align-items: center;

                  .cj_img_box {
                    width: 411rpx;
                    display: flex;
                    justify-content: space-between;
                    align-items: center;

                    .cj_item_img {
                      margin-right: 30rpx;
                      width: 109rpx;
                      height: 132rpx;
                      border-radius: 12rpx 12rpx 12rpx 12rpx;

                      image {
                        width: 109rpx;
                        height: 132rpx;
                        border-radius: 12rpx 12rpx 12rpx 12rpx;
                      }
                    }
                  }

                  .cj_item_right {
                    width: 8rpx;
                    height: 16rpx;

                    image {
                      width: 8rpx;
                      height: 16rpx;
                    }
                  }
                }
              }
            }

            .find_detail {
              width: 128rpx;
              height: 43rpx;
              background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
              border-radius: 91rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: 500;
              font-size: 24rpx;
              color: #ffffff;
              text-align: center;
              line-height: 43rpx;
            }

            .find_detail1 {
              width: 128rpx;
              height: 43rpx;
              background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
              border-radius: 91rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: 500;
              font-size: 24rpx;
              color: #ffffff;
              text-align: center;
              line-height: 43rpx;
            }

            .find_all {
              width: 128rpx;
              height: 43rpx;
              background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
              border-radius: 91rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: 500;
              font-size: 24rpx;
              color: #ffffff;
              text-align: center;
              line-height: 43rpx;
            }
          }
        }

        .feed_box {
          width: 471rpx;
          background: linear-gradient(180deg, v-bind(gradualchange) 10%, #ffffff 30%);
          border-radius: 20rpx 20rpx 20rpx 20rpx;
          padding: 30rpx;
          display: flex;
          flex-direction: column;

          .feed_header {
            display: flex;
            justify-content: space-between;
            align-items: center;

            .feed_header_title {
              font-family: PingFang SC, PingFang SC;
              font-weight: 600;
              font-size: 32rpx;
              color: #333333;
            }

            .feed_header_time {
              font-family: PingFang SC, PingFang SC;
              font-weight: 400;
              font-size: 28rpx;
              color: #333333;
            }
          }

          .feed_list {
            display: flex;
            flex-direction: column;
            margin-bottom: 20rpx;

            .feed_item {
              padding: 20rpx 0;
              border-bottom: 1rpx solid #f6f6f6;

              .feed_item_feedtype {
                display: flex;
                align-items: center;
                justify-content: space-between;

                .feed_item_feed_title {
                  font-family: PingFang SC, PingFang SC;
                  font-weight: 500;
                  font-size: 28rpx;
                  color: #333333;
                }

                .feed_item_feed_time {
                  font-family: PingFang SC, PingFang SC;
                  font-weight: 400;
                  font-size: 28rpx;
                  color: #666666;
                }
              }

              .feed_item_time {
                margin-top: 20rpx;
                font-family: PingFang SC, PingFang SC;
                font-weight: 400;
                font-size: 26rpx;
                color: #999999;
              }
            }
          }

          .find_all {
            width: 128rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
          }
        }

        .grow_box {
          width: 471rpx;
          background: linear-gradient(180deg, v-bind(gradualchange) 10%, #ffffff 30%);
          border-radius: 20rpx 20rpx 20rpx 20rpx;
          padding: 30rpx;
          display: flex;
          flex-direction: column;

          .feed_header {
            display: flex;
            justify-content: space-between;
            align-items: center;

            .feed_header_title {
              font-family: PingFang SC, PingFang SC;
              font-weight: 600;
              font-size: 32rpx;
              color: #333333;
            }

            .feed_header_time {
              font-family: PingFang SC, PingFang SC;
              font-weight: 400;
              font-size: 28rpx;
              color: #333333;
            }
          }

          .feed_list {
            display: flex;
            flex-direction: column;
            margin-bottom: 20rpx;

            .feed_item {
              padding: 20rpx 0;
              border-bottom: 1rpx solid #f6f6f6;

              .feed_item_feedtype {
                display: flex;
                align-items: center;
                justify-content: space-between;

                .feed_item_feed_title {
                  font-family: PingFang SC, PingFang SC;
                  font-weight: 500;
                  font-size: 28rpx;
                  color: #333333;
                }

                .feed_item_feed_time {
                  font-family: PingFang SC, PingFang SC;
                  font-weight: 400;
                  font-size: 28rpx;
                  color: #666666;
                }
              }

              .feed_item_time {
                margin-top: 20rpx;
                font-family: PingFang SC, PingFang SC;
                font-weight: 400;
                font-size: 26rpx;
                color: #999999;
              }
            }
          }

          .find_all {
            width: 128rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
          }
        }
        .health_BOX {
          padding: 0;
          width: 500rpx;
          height: 360rpx;
          background: #ffffff;
          .health_title {
            width: 500rpx;
            height: 68rpx;
            background: #e0f3f5;
            padding: 14rpx 0 14rpx 20rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #333333;
          }
          .health_body {
            padding: 20rpx;
            display: flex;
            flex: 1;
            flex-direction: column;
            .health_name1 {
              display: flex;
              align-items: center;
              margin-bottom: 21rpx;
            }
            .health_mid {
              display: flex;
              align-items: center;
              margin-bottom: 21rpx;
              .health_name {
                display: flex;
                align-items: center;
              }
            }
            .health_kg {
              display: flex;
              align-items: center;
              margin-bottom: 31rpx;
              .health_name {
                display: flex;
                align-items: center;
              }
            }
            .find_detail_health {
              width: 238rpx;
              height: 56rpx;
              background: #00b3c5;
              border-radius: 28rpx 28rpx 28rpx 28rpx;
              text-align: center;
              line-height: 56rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: 400;
              font-size: 28rpx;
              color: #ffffff;
            }
          }
        }
        .mandata_BOX {
          padding: 0;
          width: 500rpx;
          background: #ffffff;
          .mandata_title {
            width: 500rpx;
            height: 68rpx;
            background: #e0f3f5;
            padding: 14rpx 0 14rpx 20rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #333333;
          }
          .mandata_body {
            padding: 20rpx;
            display: flex;
            flex-direction: column;
            .mandata_object {
              display: flex;
            }
            .mandata_img_box {
              display: flex;
              align-items: center;
              flex-wrap: wrap;
              image {
                width: 145rpx;
                height: 145rpx;
                background: #f6f6f6;
                border-radius: 16rpx 16rpx 16rpx 16rpx;
                margin-right: 12rpx;
                margin-bottom: 12rpx;
              }
              image:nth-child(3n) {
                margin-right: 0;
              }
            }
          }
        }
        .shop_box {
          width: 403rpx;
          height: 168rpx;
          background: #ffffff;
          border-radius: 8rpx 8rpx 8rpx 8rpx;
          padding: 13rpx 6rpx 17rpx 15rpx;
          display: flex;
          .img_box {
            width: 138rpx;
            height: 138rpx;
            border-radius: 10rpx;
            margin-right: 9rpx;
            image {
              width: 138rpx;
              height: 138rpx;
              border-radius: 10rpx;
            }
          }
          .shop_info_box {
            display: flex;
            flex-direction: column;
            .shop_info_title {
              width: 235rpx;
              line-height: 34rpx;
              height: 78rpx;
              text-align: left;
              font-family: PingFang SC, PingFang SC;
              font-weight: 500;
              font-size: 24rpx;
              color: #333333;
              overflow: hidden;
            }
            .shop_info_price {
              display: flex;
              align-items: center;
              margin-top: 28rpx;
              .price {
                margin-right: 24rpx;
                color: #de272a;
                .price_icon {
                  margin-top: 8rpx;
                  font-family: PingFang SC, PingFang SC;
                  font-weight: 600;
                  font-size: 22rpx;
                }
                .price_num {
                  font-family: PingFang SC, PingFang SC;
                  font-weight: 800;
                  font-size: 32rpx;
                  color: #de272a;
                }
              }
              .und_price {
                font-family: PingFang SC, PingFang SC;
                font-weight: 500;
                font-size: 22rpx;
                color: #6b6b6b;
                text-decoration: line-through;
              }
            }
          }
        }
        .time-line {
          align-self: center;
          margin: 30rpx 0;
        }
        .img {
          width: 64rpx;
          height: 64rpx;
          border-radius: 50%;
        }

        .person_box {
          width: 471rpx;
          background: linear-gradient(180deg, v-bind(gradualchange) 10%, #ffffff 80%);
          border-radius: 20rpx 20rpx 20rpx 20rpx;
          padding: 26rpx 0 16rpx 26rpx;
          display: flex;
          flex-direction: column;
          .per_heard {
            display: flex;
            margin-bottom: 14prx;
            image {
              width: 37rpx;
              height: 30rpx;
              margin-right: 14rpx;
            }
          }
          .per_title {
            font-family: PingFang SC, PingFang SC;
            font-weight: 600;
            font-size: 26rpx;
            color: #333333;
          }
          .per_info {
            margin-left: 51rpx;
            display: flex;
            flex-direction: column;
            .per_info_item {
              margin-bottom: 17rpx;
              display: flex;
              align-items: center;
              .item_left {
                text-align: left;
                width: 157rpx;
                width: 150rpx;
                font-family: PingFang SC, PingFang SC;
                font-weight: 500;
                font-size: 23rpx;
                color: #000000;
              }
              .item_right {
                font-family: PingFang SC, PingFang SC;
                font-weight: 500;
                font-size: 26rpx;
                color: #333333;
              }
            }
          }
        }
        .cj_box {
          display: flex;
          flex-direction: column;
          background: linear-gradient(180deg, v-bind(gradualchange) 10%, #ffffff 30%);
          border-radius: 8rpx;
          width: 471rpx;
          padding: 30rpx;
          .cj_title {
            font-family: PingFang SC, PingFang SC;
            font-weight: 600;
            font-size: 32rpx;
            color: #333333;
            margin-bottom: 20rpx;
          }
          .cj_list {
            display: flex;
            flex-direction: column;
            .cj_item {
              flex-direction: column;
              width: 411rpx;
              display: flex;
              .cj_item_left {
                display: flex;
                flex-direction: column;
                .noready {
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                  .noready_text {
                    display: flex;
                    flex-direction: column;
                    .cj_item_title {
                      font-family: PingFang SC, PingFang SC;
                      font-weight: 500;
                      font-size: 28rpx;
                      color: #333333;
                    }
                    .cj_item_xm {
                      margin-top: 20rpx;
                      font-family: PingFang SC, PingFang SC;
                      font-weight: 500;
                      font-size: 24rpx;
                      color: #666666;
                    }
                  }
                  .cj_item_right {
                    width: 8rpx;
                    height: 16rpx;
                    image {
                      width: 8rpx;
                      height: 16rpx;
                    }
                  }
                }
                .ready_image {
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                  .cj_img_box {
                    width: 411rpx;
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    .cj_item_img {
                      margin-right: 30rpx;
                      width: 109rpx;
                      height: 132rpx;
                      border-radius: 12rpx 12rpx 12rpx 12rpx;
                      image {
                        width: 109rpx;
                        height: 132rpx;
                        border-radius: 12rpx 12rpx 12rpx 12rpx;
                      }
                    }
                  }
                  .cj_item_right {
                    width: 8rpx;
                    height: 16rpx;
                    image {
                      width: 8rpx;
                      height: 16rpx;
                    }
                  }
                }
              }
            }
            .find_detail {
              width: 128rpx;
              height: 43rpx;
              background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
              border-radius: 91rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: 500;
              font-size: 24rpx;
              color: #ffffff;
              text-align: center;
              line-height: 43rpx;
            }
            .find_detail1 {
              width: 128rpx;
              height: 43rpx;
              background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
              border-radius: 91rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: 500;
              font-size: 24rpx;
              color: #ffffff;
              text-align: center;
              line-height: 43rpx;
            }
            .find_all {
              width: 128rpx;
              height: 43rpx;
              background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
              border-radius: 91rpx;
              font-family: PingFang SC, PingFang SC;
              font-weight: 500;
              font-size: 24rpx;
              color: #ffffff;
              text-align: center;
              line-height: 43rpx;
            }
          }
        }
        .weight_box {
          background: linear-gradient(180deg, v-bind(gradualchange) 10%, #ffffff 30%);

          border-radius: 8rpx;
          width: 471rpx;
          display: flex;
          flex-direction: column;
          padding: 30rpx;
          .weight_title {
            font-family: PingFang SC, PingFang SC;
            font-weight: 600;
            font-size: 32rpx;
            color: #333333;
            margin-bottom: 10rpx;
          }
          .weight_time {
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            line-height: 28rpx;
            margin-bottom: 20rpx;
            color: #666666;
          }
          .weight_add {
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #666666;
            margin-bottom: 20rpx;
            line-height: 33rpx;
          }
          .weight_now {
            margin-bottom: 20rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #333333;
            line-height: 33rpx;
          }
          .find_detail {
            width: 128rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
          }
        }
        .eat_box {
          background: linear-gradient(180deg, v-bind(gradualchange) 10%, #ffffff 30%);
          border-radius: 8rpx;
          display: flex;
          flex-direction: column;
          width: 471rpx;
          padding: 30rpx;

          .eat_title {
            font-family: PingFang SC, PingFang SC;
            font-weight: 600;
            font-size: 32rpx;
            color: #333333;
            margin-bottom: 20rpx;
          }
          .eat_time {
            margin-bottom: 20rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #333333;
            line-height: 33rpx;
          }
          .eat_list {
            .eat_item {
              .eat_food {
                display: flex;
                .eat_food_left {
                  width: 112rpx;
                  font-family: PingFang SC, PingFang SC;
                  font-weight: 500;
                  font-size: 28rpx;
                  color: #333333;
                }
                .eat_food_right {
                  flex: 1;
                  margin-left: 22rpx;
                  .eat_food_item {
                    font-family: PingFang SC, PingFang SC;
                    font-weight: 500;
                    font-size: 28rpx;
                    color: #333333;
                  }
                }
              }
            }
          }
          .find_detail {
            width: 128rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
          }
          .find_more {
            width: 221rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
          }
        }
        .sport_box {
          display: flex;
          flex-direction: column;
          background: linear-gradient(180deg, v-bind(gradualchange) 10%, #ffffff 30%);
          border-radius: 8rpx;
          width: 471rpx;
          padding: 30rpx;

          .sport_title {
            font-family: PingFang SC, PingFang SC;
            font-weight: 600;
            font-size: 32rpx;
            color: #333333;
            margin-bottom: 20rpx;
          }
          .sport_time {
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #333333;
            line-height: 33rpx;
            margin-bottom: 20rpx;
          }
          .sport_obj {
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #333333;
            margin-bottom: 20rpx;
          }
          .sport_obj:last-child {
            margin-bottom: 0;
          }
          .find_detail {
            width: 128rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
          }
          .find_more {
            width: 221rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
          }
        }
        .sleep_box {
          background: linear-gradient(180deg, v-bind(gradualchange) 10%, #ffffff 30%);
          border-radius: 8rpx;
          width: 471rpx;
          display: flex;
          flex-direction: column;
          padding: 30rpx;

          .sleep_title {
            font-family: PingFang SC, PingFang SC;
            font-weight: 600;
            font-size: 32rpx;
            color: #333333;
            margin-bottom: 20rpx;
          }
          .sleep_time {
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 28rpx;
            color: #333333;
            line-height: 33rpx;
            margin-bottom: 35rpx;
          }
          .sleep_list {
            display: flex;
            flex-direction: column;

            .sleep_item {
              display: flex;
              align-items: center;
              flex-direction: column;

              .sleep_top {
                display: flex;
                align-items: center;
                padding-bottom: 15rpx;
                .sleep_item_left {
                  width: 55rpx;
                  height: 55rpx;
                  image {
                    width: 55rpx;
                    height: 55rpx;
                  }
                }
                .sleep_item_middle {
                  font-family: PingFang SC, PingFang SC;
                  font-weight: 500;
                  font-size: 28rpx;
                  color: #333333;
                }
                .sleep_item_right {
                  padding: 7rpx 26rpx 10rpx;
                  display: flex;
                  flex-direction: column;
                  width: 204rpx;
                  background: #ede9ff;
                  border-radius: 16rpx 16rpx 16rpx 16rpx;
                  .sleep_item_right_top {
                    font-family: PingFang SC, PingFang SC;
                    font-weight: 500;
                    font-size: 28rpx;
                    color: #333333;
                  }
                  .sleep_item_right_btm {
                    width: 100%;
                    margin-top: 7rpx;
                    font-family: PingFang SC, PingFang SC;
                    font-weight: 500;
                    font-size: 23rpx;
                    color: #333333;
                  }
                }
              }
            }
            .sleep_item:last-child .sleep_top {
              padding-bottom: 0;
            }
          }
          .find_detail {
            width: 128rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
          }
          .find_more {
            width: 221rpx;
            height: 43rpx;
            background: linear-gradient(90deg, v-bind(buttonColor) 0%, v-bind(color) 100%);
            border-radius: 91rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 24rpx;
            color: #ffffff;
            text-align: center;
            line-height: 43rpx;
            margin-top: 25rpx;
          }
        }
        .article_box {
          width: 450rpx;
          height: 272rpx;
          background: #ffffff;
          border-radius: 20rpx;
          padding: 15rpx 15rpx 10rpx 15rpx;
          .article_title {
            font-family: PingFangSC, PingFang SC;
            font-weight: 500;
            font-size: 26rpx;
            color: #202020;
            line-height: 37rpx;
            margin-bottom: 10rpx;
          }
          .content_box {
            display: flex;
            justify-content: space-between;
            .content_box_text {
              margin-right: 30rpx;
              flex: 1;
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 24rpx;
              color: #5c5c5c;
              line-height: 33rpx;
            }
            .content_box_image {
              width: 100rpx;
              height: 100rpx;
              background: #d8d8d8;
              border-radius: 10rpx;
              image {
                width: 100rpx;
                height: 100rpx;
                background: #d8d8d8;
                border-radius: 10rpx;
              }
            }
          }
          .tag_box {
            display: flex;
            align-items: center;

            .tag_box_img {
              margin-right: 10rpx;

              image {
                width: 24rpx;
                height: 18rpx;
              }
            }
            .tag_box_text {
              font-family: PingFangSC, PingFang SC;
              font-weight: 400;
              font-size: 24rpx;
              color: #aaaaaa;
            }
          }
        }
      }
    }
    .message_item:last-child {
      margin-bottom: 30rpx;
    }
  }
}
.change_box {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  width: 750rpx;
  height: 88rpx;
  background: #ffffff;
  backdrop-filter: blur(10px);
  .change_tabs {
    width: 150rpx;
    height: 48rpx;
    line-height: 48rpx;
    border-radius: 34rpx;
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 26rpx;
    text-align: center;
  }
}
.top_box {
  width: 750rpx;
  height: 68rpx;
  background: #d6eeed;
  box-sizing: border-box;

  .top {
    width: 702rpx;
    height: 68rpx;
    font-family: PingFang SC, PingFang SC;
    font-weight: 400;
    font-size: 28rpx;
    color: #202020;
    line-height: 68rpx;
    box-sizing: border-box;
    padding: 0 20rpx;

    .top_btn {
      width: 114rpx;
      height: 40rpx;
      background: #ffffff;
      border-radius: 20rpx 20rpx 20rpx 20rpx;
      color: #d76d19;
      margin-right: 20rpx;
    }
  }
}
.patients_scroll {
  display: flex;
  flex-direction: column;
  align-items: center;
  .profile_title {
    width: 702rpx;
    height: 140rpx;
    background: #ffffff;
    border-radius: 20rpx;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20rpx 0;
    margin-top: 20rpx;
    .real_identifier {
      width: 118rpx;
      height: 48rpx;
      background: #ffffff;
      border-radius: 24rpx 0rpx 0rpx 24rpx;
      border-top: 1rpx solid #00c1b9;
      border-bottom: 1rpx solid #00c1b9;
      border-left: 1rpx solid #00c1b9;
      font-size: 24rpx;
      color: #00c1b9;
      text-align: center;
      line-height: 48rpx;
    }
    .profile_title_box {
      margin-left: 20rpx;
      display: flex;
      align-items: center;
      image {
        width: 100rpx;
        height: 100rpx;
        border-radius: 10rpx;
      }
      .patient {
        height: 100rpx;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        margin-left: 20rpx;
        .patient_name {
          font-size: 30rpx;
          color: #202020;
          font-weight: 600;
        }
        .patient_info {
          display: flex;
          align-items: center;
          font-size: 26rpx;
          color: #5c5c5c;
          .name_leng {
            width: 1rpx;
            height: 24rpx;
            background: #5c5c5c;
          }
        }
      }
    }
  }
  .basic_info_box {
    width: 702rpx;
    background: #ffffff;
    border-radius: 20rpx;
    padding: 30rpx 20rpx;
    margin: 20rpx 0;
    .info_title {
      font-size: 30rpx;
      color: #202020;
      font-weight: 600;
      margin-bottom: 10rpx;
    }
    .info_list {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: 90rpx;
      border-bottom: 1rpx solid #e8e8e8;
      font-size: 28rpx;
      &:last-child {
        border-bottom: none;
        height: 50rpx;
        margin-top: 20rpx;
      }
    }
  }
  //产检记录
  .record_box {
    width: 702rpx;
    background: #ffffff;
    border-radius: 20rpx;
    padding: 30rpx 20rpx;
    .record_title_box {
      display: flex;
      align-items: center;
      justify-content: space-between;
      .record_title {
        font-size: 30rpx;
        color: #202020;
        font-weight: 600;
      }
      .look_details {
        width: 144rpx;
        height: 48rpx;
        background: #00c1b9;
        border-radius: 24rpx;
        font-size: 26rpx;
        color: #ffffff;
        text-align: center;
        line-height: 48rpx;
      }
    }
    .cycle_box {
      margin-top: 20rpx;
      .cycle {
        font-weight: 600;
        font-size: 28rpx;
        color: #00c1b9;
      }
      .product {
        display: flex;
        align-items: center;
        margin: 20rpx 0;
        font-size: 26rpx;
        color: #5c5c5c;
        .product_list {
          width: 500rpx;
          overflow: hidden;
        }
      }
      .date_box {
        display: flex;
        align-items: center;
        font-size: 26rpx;
        color: #5c5c5c;
      }
    }
    .inspect_table {
      display: flex;
      align-items: center;
      margin-top: 6rpx;
      image {
        width: 180rpx;
        height: 180rpx;
        margin-right: 10rpx;
      }
    }
  }
  //日常记录
  .dailyrecord_box {
    width: 702rpx;
    background: #ffffff;
    border-radius: 20rpx;
    padding: 30rpx 20rpx;
    margin-top: 20rpx;
    .record_title {
      font-weight: 600;
      font-size: 30rpx;
      color: #202020;
    }
    .record_list {
      display: flex;
      align-items: center;
      image {
        width: 29rpx;
        height: 30rpx;
      }
      .record_item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 612rpx;
        margin-left: 26rpx;
        height: 100rpx;
        border-bottom: 1rpx solid #e8e8e8;
        .record_product {
          font-size: 28rpx;
          color: #202020;
        }
      }
      &:last-child {
        margin-top: 20rpx;
      }
    }
  }
}

.navbar_img {
  width: 52rpx;
  height: 80rpx;
  box-sizing: border-box;
  padding: 24rpx 4rpx 24rpx 20rpx;
  image {
    width: 32rpx;
    height: 6rpx;
  }
}

.bottom1 {
  position: fixed;
  bottom: 0;
  left: 0;
  background-color: white;
  width: 100%;
  justify-content: flex-start;
  .flex {
    padding: 15rpx 24rpx 0;
    display: flex;
    align-items: center;
  }
  .send_text {
    width: 100rpx;
    height: 60rpx;
    background: #05d166;
    border-radius: 14rpx 14rpx 14rpx 14rpx;
    font-family: PingFang SC, PingFang SC;
    font-weight: 600;
    font-size: 28rpx;
    color: #ffffff;
    text-align: center;
    line-height: 60rpx;
  }
  .ipt {
    box-sizing: border-box;
    background-color: #ffffff;
    margin: 0 20rpx;
    flex: 1;
    textarea {
      min-height: 60rpx;
      width: 100%;
      background: #f5f6f8;
      text-indent: 20rpx;
      border-radius: 34rpx;
      font-family: PingFang SC, PingFang SC;
      font-weight: 500;
      line-height: 60rpx;
      font-size: 30rpx;
      color: #333333;
    }
    .ipt_au {
      width: 100%;
      height: 60rpx;
      line-height: 60rpx;
      background: #00c1b9;
      border-radius: 10rpx;
      text-align: center;
      font-family: PingFangSC, PingFang SC;
      font-weight: 400;
      font-size: 26rpx;
      color: #ffffff;
    }
  }
  .send {
    background-color: aqua;
    border-radius: 10rpx;
    color: white;
    padding: 5rpx 10rpx;
    font-size: 28rpx;
    align-items: center;
  }
}

.active {
  // height: 27vh;
}

.userText {
  background-color: rgb(75, 227, 128);
}
.heard_top {
  background: #ffffff !important;
  .poput_title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100rpx;
    background: #ffffff;
    padding: 0 24rpx;
    .car_box_search_icon {
      width: 38rpx;
      height: 38rpx;
      image {
        width: 38rpx;
        height: 38rpx;
      }
    }
    .title_left {
      font-family: PingFangSC, PingFang SC;
      font-weight: 400;
      font-size: 36rpx;
      color: #202020;
    }
    .title_right {
      font-family: PingFangSC, PingFang SC;
      font-weight: 400;
      font-size: 30rpx;
      color: #5c5c5c;
    }
  }
  .car_box_search {
    width: 750rpx;
    height: 88rpx;
    background: #ffffff;
    box-sizing: border-box;
    // padding: 30rpx 0 20rpx 30rpx;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    .car_box_search_icon {
      margin-left: 24rpx;

      width: 38rpx;
      height: 38rpx;
      image {
        width: 38rpx;
        height: 38rpx;
      }
    }

    .car_box_search_l {
      flex: 1;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      width: 564rpx;
      height: 70rpx;
      background: #f5f6f8;
      border-radius: 35rpx;
      border-radius: 32rpx;
    }
    .car_box_search_l_btn {
      width: 111rpx;
      height: 64rpx;
      border-radius: 27rpx 27rpx 27rpx 27rpx;
      font-family: PingFang SC, PingFang SC;
      font-weight: 500;
      font-size: 30rpx;
      color: #00c1b9;
      line-height: 64rpx;
      text-align: center;
      margin-left: 10rpx;
    }
  }

  .search-tab {
    width: 750rpx;
    height: 88rpx;
    background: #ffffff;
    line-height: 88rpx;
    // display: flex;
    // // justify-content: space-between;
    // align-items: center;
    // width: 100%;
    // height: 88rpx;
    // background: #ffffff;
  }
}
::v-deep .tabs__wrapper__nav__line {
  bottom: 10rpx;
}
.tip_text {
  font-family: PingFang SC, PingFang SC;
  font-weight: 500;
  font-size: 24rpx;
  color: #999999;
  text-align: center;
}
.car_box {
  padding-top: 20rpx;
  height: 80vh;
  overflow-y: scroll;
  // #ifdef APP-PLUS || APP-IOS || APP-ANDROID
  // padding-bottom: 173rpx;
  /* #endif */
}
.trolley-box {
  width: 702rpx;
  height: 236rpx;
  background: #ffffff;
  border-radius: 16rpx;
  margin: 0 auto 20rpx;
  overflow: hidden;
  padding: 23rpx;

  .trolley-bottom {
    display: flex;

    .trolley-choose {
      width: 36rpx;
      height: 36rpx;
      border-radius: 50%;
      background: #fff;
      border: 2rpx solid #c5c5c5;
      display: flex;
      justify-content: center;
      align-items: center;
      margin: 80rpx 10rpx auto 30rpx;
    }

    .chooseTrue {
      border-color: #00c1b9;
      background: #00c1b9;
    }
    .chooseFalse {
      border-color: #e8e8e8;
      background: #e8e8e8;
    }
    .trolley-img {
      width: 190rpx;
      height: 190rpx;
      position: relative;
      border-radius: 16rpx;

      image {
        width: 190rpx;
        height: 190rpx;
        border-radius: 16rpx;
      }

      .trolley-img_none {
        position: absolute;
        top: 0;
        left: 0;
        width: 190rpx;
        height: 190rpx;
        border-radius: 16rpx;
        background: rgba(113, 129, 140, 0.8);
        font-family: PingFang SC, PingFang SC;
        font-weight: 500;
        font-size: 28rpx;
        color: #ffffff;
        line-height: 190rpx;
        text-align: center;
      }
    }

    .trolley-info {
      width: 395rpx;
      margin-left: 21rpx;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      .trolley-name {
        font-size: 28rpx;
        font-weight: 400;
        color: #333333;
        line-height: 32rpx;
        margin-top: 4rpx;
      }
      .trolley-coupon {
        height: 34rpx;
        background: url('/static/shop/quan.png') no-repeat;
        background-size: 100% 100%;
        margin-top: 18rpx;
        box-sizing: border-box;
        padding-left: 52rpx;
        padding-right: 10rpx;
        font-family: PingFang SC, PingFang SC;
        font-weight: 500;
        font-size: 22rpx;
        color: #ffffff;
        line-height: 34rpx;
        float: left;
        margin-bottom: 10rpx;
      }

      .trolley-none {
        font-family: PingFang SC, PingFang SC;
        font-weight: 500;
        font-size: 26rpx;
        color: #333333;
        line-height: 28rpx;
        padding-top: 38rpx;
      }

      .trolley-preferential {
        max-width: 98%;
        margin-top: 22rpx;
        display: inline-block;
        height: 32rpx;
        background: #ffffff;
        border-radius: 8rpx;
        border: 1rpx solid #ff9595;
        font-size: 24rpx;
        font-weight: 500;
        color: #ff0808;
        line-height: 30rpx;
        padding: 0 4rpx;
      }

      .trolley-rows {
        clear: both;
        display: flex;
        align-items: flex-end;
        height: 50rpx;
        padding-top: 16rpx;

        .trolley-price {
          font-size: 32rpx;
          font-weight: 500;

          line-height: 32rpx;

          text {
            font-size: 20rpx;
          }
        }
        .priceColor {
          color: #de272a;
        }
        .ot_price {
          color: #6b6b6b;
        }
      }
    }

    .trolley-detail {
      width: 395rpx;
      height: 190rpx;
      background: #f6fbff;
      border-radius: 8rpx;

      .trolley-detail_t {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        padding: 10rpx;

        .trolley-detail_t_l {
          font-family: PingFang SC, PingFang SC;
          font-weight: 500;
          font-size: 24rpx;
          color: #333333;
          line-height: 28rpx;
        }

        image {
          width: 30rpx;
          height: 30rpx;
        }
      }

      .trolley-detail_b {
        padding: 10rpx;
        overflow: hidden;

        .trolley-detail_b_img {
          float: left;
          width: 118rpx;
          height: 118rpx;
          border-radius: 8rpx;
        }

        .trolley-detail_b_r {
          width: 233rpx;
          float: left;
          margin-left: 20rpx;

          .trolley-detail_b_r_t {
            width: 208rpx;
            height: 28rpx;
            font-family: PingFang SC, PingFang SC;
            font-weight: 500;
            font-size: 26rpx;
            color: #333333;
            line-height: 28rpx;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
          }

          .trolley-detail_b_r_b {
            padding-top: 50rpx;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-between;

            .trolley-detail_b_r_b_l {
              font-family: PingFang SC, PingFang SC;
              font-weight: 500;
              font-size: 28rpx;
              color: #de272a;
              line-height: 32rpx;

              text {
                font-size: 20rpx;
              }
            }

            .trolley-detail_b_r_b_r {
              width: 32rpx;
              height: 32rpx;
            }
          }
        }
      }
    }
  }
}
.nocontent {
  margin-top: 180rpx;
  font-family: PingFangSC, PingFang SC;
  font-weight: 400;
  font-size: 26rpx;
  color: #aaaaaa;
  text-align: center;
}
.trolley-totalize {
  position: fixed;
  z-index: 99;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 168rpx;
  background: #ffffff;
  display: flex;
  overflow: hidden;

  .trolley-choose {
    width: 36rpx;
    height: 36rpx;
    border-radius: 50%;
    background: #ffffff;
    border: 2rpx solid #cfcfcf;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 32rpx 10rpx auto 24rpx;
  }

  .chooseTrue {
    border-color: #00c1b9;
    background: #00c1b9;
  }
  .chooseFalse {
    border-color: #e8e8e8;
    background: #e8e8e8;
  }

  .totalize-text1 {
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 26rpx;
    color: #5c5c5c;
    margin-top: 32rpx;
  }

  .totalize-text2 {
    font-size: 24rpx;
    font-weight: 400;
    color: #979797;
    line-height: 36rpx;
    margin-top: 32rpx;
    margin-left: 23rpx;
  }

  .totalize-button {
    width: 160rpx;
    height: 70rpx;
    background: #e8e8e8;
    border-radius: 34rpx;
    background: #a28aff;
    text-align: center;
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 30rpx;
    color: #aaaaaa;
    line-height: 70rpx;
    margin: 15rpx 24rpx auto auto;
  }
}
.chat_end_box {
  height: 168rpx;
  background: #ededee;
  .end_tip_box {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100rpx;
    .icon_box {
      margin-right: 10rpx;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 26rpx;
      height: 26rpx;
      image {
        width: 26rpx;
        height: 26rpx;
      }
    }
    .end_tip {
      font-family: PingFangSC, PingFang SC;
      font-weight: 400;
      font-size: 28rpx;
      color: #aaaaaa;
    }
  }
  .placheholder_box {
    height: 68rpx;
  }
}
.pagess {
  width: 100%;
  background: #f5f6f8;
  font-family: PingFangSC, PingFang SC;
  display: flex;
  flex-direction: column;
  align-items: center;
  // padding-bottom: 200rpx;
  .profile_title {
    width: 702rpx;
    height: 140rpx;
    background: #ffffff;
    border-radius: 20rpx;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20rpx 0;
    margin-top: 20rpx;
    .real_identifier {
      width: 118rpx;
      height: 48rpx;
      background: #ffffff;
      border-radius: 24rpx 0rpx 0rpx 24rpx;
      border-top: 1rpx solid #00c1b9;
      border-bottom: 1rpx solid #00c1b9;
      border-left: 1rpx solid #00c1b9;
      font-size: 24rpx;
      color: #00c1b9;
      text-align: center;
      line-height: 48rpx;
    }
    .profile_title_box {
      margin-left: 20rpx;
      display: flex;
      align-items: center;
      image {
        width: 100rpx;
        height: 100rpx;
        border-radius: 10rpx;
      }
      .patient {
        height: 100rpx;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        margin-left: 20rpx;
        .patient_name {
          font-size: 30rpx;
          color: #202020;
          font-weight: 600;
        }
        .patient_info {
          display: flex;
          align-items: center;
          font-size: 26rpx;
          color: #5c5c5c;
          .name_leng {
            width: 1rpx;
            height: 24rpx;
            background: #5c5c5c;
          }
        }
      }
    }
  }
  .basic_info_box {
    width: 702rpx;
    background: #ffffff;
    border-radius: 20rpx;
    padding: 30rpx 20rpx;
    margin: 20rpx 0;
    .info_title {
      font-size: 30rpx;
      color: #202020;
      font-weight: 600;
      margin-bottom: 10rpx;
    }
    .info_list {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: 90rpx;
      border-bottom: 1rpx solid #e8e8e8;
      font-size: 28rpx;
      &:last-child {
        border-bottom: none;
        height: 50rpx;
        margin-top: 20rpx;
      }
    }
  }
  //产检记录
  .record_box {
    width: 702rpx;
    background: #ffffff;
    border-radius: 20rpx;
    padding: 30rpx 20rpx;
    .record_title_box {
      display: flex;
      align-items: center;
      justify-content: space-between;
      .record_title {
        font-size: 30rpx;
        color: #202020;
        font-weight: 600;
      }
      .look_details {
        width: 144rpx;
        height: 48rpx;
        background: #00c1b9;
        border-radius: 24rpx;
        font-size: 26rpx;
        color: #ffffff;
        text-align: center;
        line-height: 48rpx;
      }
    }
    .cycle_box {
      margin-top: 20rpx;
      .cycle {
        font-weight: 600;
        font-size: 28rpx;
        color: #00c1b9;
      }
      .product {
        display: flex;
        align-items: center;
        margin: 20rpx 0;
        font-size: 26rpx;
        color: #5c5c5c;
        .product_list {
          width: 500rpx;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 1;
          overflow: hidden;
          text-overflow: ellipsis;
          text {
            margin-right: 10rpx;
          }
        }
      }
      .date_box {
        display: flex;
        align-items: center;
        font-size: 26rpx;
        color: #5c5c5c;
      }
    }
    .inspect_table {
      display: flex;
      align-items: center;
      margin-top: 6rpx;
      image {
        width: 180rpx;
        height: 180rpx;
        margin-right: 10rpx;
        border-radius: 10rpx;
      }
    }
  }
  //日常记录
  .dailyrecord_box {
    width: 702rpx;
    background: #ffffff;
    border-radius: 20rpx;
    padding: 30rpx 20rpx;
    margin-top: 20rpx;
    .record_title {
      font-weight: 600;
      font-size: 30rpx;
      color: #202020;
    }
    .record_list {
      display: flex;
      align-items: center;
      image {
        width: 29rpx;
        height: 30rpx;
      }
      .record_item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 612rpx;
        margin-left: 26rpx;
        height: 100rpx;
        border-bottom: 1rpx solid #e8e8e8;
        .record_product {
          font-size: 28rpx;
          color: #202020;
        }
      }
      &:last-child {
        margin-top: 20rpx;
      }
    }
  }
  //健康信息
  .Health_info {
    width: 702rpx;
    background: #ffffff;
    border-radius: 20rpx;
    padding: 30rpx 20rpx;
    margin-top: 20rpx;
    .Health_info_title {
      font-weight: 600;
      font-size: 30rpx;
      color: #202020;
    }
    .inspect_type {
      font-size: 28rpx;
      color: #5c5c5c;
    }
    .inspect_result {
      font-size: 28rpx;
      color: #202020;
    }
    .inspect_content {
      background: #f5f6f8;
      border-radius: 10rpx;
      padding: 20rpx;
    }
  }
}
.prompt-layer {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(0, 0, 0, 0.4);
  z-index: 5;
  .prompt-popup {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 220rpx;
    // line-height: 200rpx;
    color: #000000;
    font-size: 28rpx;
    font-weight: 400;
    text-align: center;
    &::after {
      content: '';
      position: absolute;
      left: -10%;
      bottom: -52%;
      border-radius: 50%; //顶部圆弧，底部圆弧： 0 0 50% 50%
      width: 120%;
      height: 185%;
      background: #cccccc;
      z-index: -1;
    }
  }
}
.scroll-v {
  height: 334rpx;
}
.msg_config_box {
  width: 750rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  .msg_config {
    width: 702rpx;
    border-bottom: 1rpx solid #e8e8e8;
    padding: 32rpx 0;
    font-family: PingFang SC, PingFang SC;
    font-weight: 400;
    font-size: 26rpx;
    color: #202020;
  }
}
.operating_area {
  width: 750rpx;
  height: 100rpx;
  display: flex;
  align-items: center;
  .left_area,
  .right_area {
    width: 375rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: PingFang SC, PingFang SC;
    font-weight: 400;
    font-size: 28rpx;
    color: #202020;
  }
}
.nones_add_box {
  width: 750rpx;
  display: flex;
  justify-content: center;
  margin-top: 70rpx;
  .nones_add_btn {
    width: 702rpx;
    height: 88rpx;
    background: #00c1b9;
    border-radius: 48rpx;
    font-family: PingFang SC, PingFang SC;
    font-weight: 500;
    font-size: 32rpx;
    color: #ffffff;
    text-align: center;
    line-height: 88rpx;
  }
}
</style>
